Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #480633

    Hi all,

    Apologies as this has been addressed in the past (post #359852) but I’m now seeing the same problem again after an update to 3.2.3 on my dev site: dev.marcgodfreeweddings.co.uk

    On the main menu my Search option icon has dropped to a second line instead of being on the same level. I have previously used the code:

    @media only screen and (max-width: 1139px) {
        .av-main-nav > li > a {
            padding: 0 10px;
        }
        #header_main_alternate .container {
            padding: 0 20px;
        }
    }

    and code:

    @media only screen and (max-width: 990px) {
    .title_container .breadcrumb { right: auto; top: 75%; left: 0; margin-left: -2px; }
    #top .title_container .container { min-height: 60px; }}

    I am guessing its another slight tweak that’s needed but not too sure what I need to change.

    As an additional problem on the iPad in portrait mode I am seeing that the breadcrumb on subsequent pages is defaulting to the far left as opposed to being inline with the page title and main content. Please could you let me know how to realign this?

    Thanks in advance
    Marc

    • This topic was modified 9 years, 4 months ago by MarcG5.
    #480907

    Hey MarcG5!

    Add this to your custom CSS.

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

    You may need to increase the 900px value.

    Regards,
    Elliott

    #481472

    Thanks for your reply Elliott,

    Unfortunately this doesn’t fix the problem other than allow me to switch the menu to the mobile view when changing the 900px value. Is there anything else I can try?

    Also any thoughts on the breadcrumb alignment issue in portrait view on the iPad?

    Thanks
    Marc

    #481867

    Hi!

    You can decrease the min width of the menu items on smaller screens:

    @media screen and (max-width:1100px) {
    .av_seperator_big_border .av-main-nav > li > a {
        min-width: 85px;
    }
    }

    Regarding the breadcrumbs, you need to adjust your own css modification:

    @media only screen and (max-width: 990px) {
    .title_container .breadcrumb {
        right: auto;
        top: 75%;
        left: 0;
        margin-left: -2px;
    }}

    Best regards,
    Ismael

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