Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #436627

    Hi, I had the same query late last year as on an IPAD my menu does not fit onto one line and overflows onto a second line; I was given the following to add into the quick CSS; (which is still in the CSS)

    @media only screen and (max-width: 990px) {
    .responsive .boxed#top, .responsive.html_boxed.html_header_sticky #header {
    width: 100%; }}

    @media only screen and (max-width: 1140px) {
    .av-main-nav > li > a { padding: 0 6px; }}

    @media only screen and (max-width: 1024px) {
    .responsive .boxed#top, .responsive.html_boxed.html_header_sticky #header {
    width: 100%;
    max-width: 100%;
    }
    }

    The above worked and my menu was appearing on one line, like it does on a desktop PC, but I have just noticed it is now not fitting onto one line on the Ipad any more.

    Please could you review and advise.

    Many thanks
    Regards Belinda

    #436640

    Hi Belinda!

    Can you please post the link to your website?

    Best regards,
    Yigit

    #437125

    Hi Yigit

    http://www.topchoicepestcontrol.com.au/

    Regards Belinda

    #437746

    Hey!

    Please add following code to Quick CSS

    @media only screen and (max-width: 1165px) and (min-width: 990px) {
    #header_main_alternate .container { padding: 0; }
    #top .av_seperator_big_border#header .av-main-nav > li > a { padding: 0 7px; }}

    Regards,
    Yigit

    #437858

    Thanks Yigit,

    I have done that, now only the menu tab ‘contact’ overflows onto the second line.

    Regards Belinda

    #438144

    Hi!

    Please try changing “0 7px” to “0 6px” in my previous code

    Regards,
    Yigit

    #438864

    Hi Yigit,

    I made the change and the menu tab ‘contact’ remains on the second line.

    Regards Belinda

    #438889

    Hey!

    Can you please add following code to Quick CSS as well

    @media only screen and (max-width: 1100px) {
    #top .av_seperator_big_border#header .av-main-nav > li > a {
      padding: 0 8px;
    }}

    Regards,
    Yigit

    #440065

    Hi Yigit,

    I have added the code and the menu tab ‘contact’ remains on the second line

    Regards Belinda

    #440810

    Hey!

    Adjust the value. Use 7px for example:

    @media only screen and (max-width: 1100px) {
    #top .av_seperator_big_border#header .av-main-nav > li > a {
      padding: 0 7px;
    }}

    Remove browser cache then reload the page.

    Best regards,
    Ismael

    #441430

    Hi,

    I have tried that changing it to 0.7, 0.6 and 0.5 and clearing browser cache each time and reloading the page and no change.

    Regards Belinda

    #441670

    Hi!

    Do you mind creating a temporary admin login and posting it here privately?

    Regards,
    Yigit

    #442075
    This reply has been marked as private.
    #442374

    Hey!

    It’s not working because the “greater than” symbol is converted to its html character entity code. Please check it now.

    Cheers!
    Ismael

    #442703

    Hi Yigit

    Thank you very much for all your help

    Regards Belinda

    #443077

    Hi!

    Great, glad you got it fixed :)

    Regards,
    Rikard

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