Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #417518

    We launched a site with Enfold because it was supposedly responsive. Private details below.

    #418130

    Hey DJQuad!

    The only thing I noticed was that the menu and logo were running into each other. You can change that with this CSS.

    @media (max-width:900px) {
    nav.main_menu { display: none !important; }
    #advanced_menu_toggle { display: block !important; }
    }

    Best regards,
    Elliott

    #418136

    That didn’t help. The nav is on 2 lines overlapping the text under it.

    #418415

    Hi!

    You could try setting the break point to a larger value:

    @media only screen and (max-width: 1200px) {
    nav.main_menu { display: none !important; }
    #advanced_menu_toggle { display: block !important; }
    }

    Best regards,
    Rikard

    #419019

    What is the *proper* break point for iPads? I’m at a loss as to why Enfold doesn’t have proper break points for iPads and other mobile screens. Suggestions on increasing the break point isn’t the solution because it will look equally as bad on larger monitors.

    There’s no reason why the menu shouldn’t scale and not overlap the menu. Themes like Avada and X handle it just fine.

    #419080

    Hi!

    It is difficult to predict every kind of logo/menu combination. In your particular case, i think the best solution would be to enable the 990px breakpoint here and reduce the font-size + padding of the menu items based on the screen size, something like this in Quick CSS will do it:

    @media only screen and (max-width: 1200px) {
    	.responsive #top #header .av-main-nav > li > a{
    		font-size: 14px !important;
    	}
    }
    
    @media only screen and (max-width: 1100px) {
    	.responsive #top #header .av-main-nav > li > a{
    		font-size: 12px !important;
    		padding: 0 8px;
    	}
    }

    Cheers!
    Josue

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