Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #685651

    Hi there,

    I am having issues with the Enfold theme, the main menu items are non-responsive with items ‘dropping off’ the main menu on different sized screens. I am using a macbook air and all looks fine my end but seeing issues on MB Pro & ipad screens. This is also affecting the appearance of the buttons on the home page and by looks of it, any items I have added code to. They are resizing or moving off centre on different screen sizes.

    The mobile settings are set to the second option so this is all fine, it’s more laptop & ipad screen sizes that there seems to be an issue. This is my first time using wordpress so please forgive my amateur status! :)

    Please can you help fix?

    Thank you.

    #686658

    Hey joshtullymanagement!

    Thank you for using Enfold.

    Please provide a link to the page with the issue. And make sure that the latest version of the theme is installed, 3.8.

    Cheers!
    Ismael

    #686843

    Hi there – please see link to page below.
    Latest version installed.
    As you can see, the ‘Lifestyle’ and ‘Events’ buttons are also being skewed on different screen sizes.

    Hope you can help.
    Thanks.

    #688891

    Hi,

    Thank you for the info. And sorry for the delay.

    I can see the issue with the buttons but the main menu looks perfectly fine. Please add this in the Quick CSS field:

    @media only screen and (max-width: 1024px) {
    .avia-button.avia-size-large {
        font-size: 18px;
    }
    }

    And please remove this invalid css code inside the Quick CSS field or the style.css file:

    .avia-button-center {
        display: center;
        padding: 0 5px;
    }

    Best regards,
    Ismael

    #690406

    Hi Ismael – thanks for your response. I ended up reducing the padding between the menu elements to solve the menu overlapping.

    I am still having issues with the site on mobile, can you help?

    1) How can I create padding above and below the logo? When I try to adjust CSS, nothing is happening. The logo currently sits right on the bottom section and the logo top right under the upper screen edge.

    2) The testimonials are very long when viewed on the mobile, should the responsive template adapt the testimonial so the text appears smaller on the mobile? Am I doing something wrong? The site on mobile does not look anywhere near as good on the mobile as its does on a laptop which is disappointing. Sections are being cut off ( The Lifestyle page on the mobile for example crops the hero images)

    Any help would be appreciated.
    Thank you.

    #691028

    Can anyone help me on this please? I figured out how to make the testimonials smaller by adding CSS code.

    How can I adjust the image sizes to adapt to mobile and ipad? They are too zoomed in and I am losing the full image on a mobile.

    Can you also help with the logo issue? It would be good to get these issues fixed please.

    Thank you.

    #692145

    Hi,

    please use different tickets for different questions.

    1.) Use this code:

    @media only screen and (max-width: 767px) {
    .responsive .logo img {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
    }}
    

    2.) You can use a smaller font on mobile for it:

    @media only screen and (max-width: 767px) {
    #top .av-large-testimonial-slider .avia-testimonial-content {
    font-size: 14px;
    }}
    

    Adjust as needed.

    Best regards,
    Andy

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.