- This topic has 13 replies, 2 voices, and was last updated 5 years, 9 months ago by Andrew Misplon.
Tagged: main menu width
- AuthorPosts
- February 13, 2019 at 5:54 pm #12068
BrunoParticipantHI, Support Team;
here the url of my demo:
http://demo3.brunotominetti.com/test1
I am trying to insert css custom attributes in order to have the main menu with theese long labels that I can not change.. :-((The original attributes:
.main-navigation {
box-sizing: border-box;
float: right;
max-width: 65%;
margin-left: 0;
}
Something I have read in the posts of the support area but it didn’t work:
.main-navigation {
max-width: none;
}
I tried like this but it didn’t work:
.main-navigation {max-width: 80%;
}
Thank You in advance, even for the very good theme; sorry for my bd english
BrunoFebruary 13, 2019 at 6:05 pm #12069
Andrew MisplonKeymasterHi Bruno
Thanks for reaching out.
How would you like the menu to change from how it is now?
February 14, 2019 at 9:20 am #12079
BrunoParticipantHI Andrew,
I would lke to have the menu width more than 65%, see the screenshot showing watts hapent when resizing browser window:this css attribute didn’t change the whidt
.main-navigation {
max-width: 80% or none}
Thank you wery much in advance
BrunoFebruary 14, 2019 at 9:22 am #12080
Andrew MisplonKeymasterThanks 🙂 Can you perhaps try sending the screenshot again? I don’t see it. https://imgur.com/upload is easy to use.
February 14, 2019 at 9:22 am #12081
BrunoParticipantHI, sorry, I loose the image
February 14, 2019 at 9:25 am #12082
Andrew MisplonKeymasterThe default min-width is 144px. You can try adding the following to
Customize > Additional CSS
or the Custom CSS location of your choosing and edit the value as required:.main-navigation ul ul li { min-width: 200px !important; }
February 14, 2019 at 9:28 am #12083
Andrew MisplonKeymasterPlease, ignore my above reply. To resolve the problem in your screenshot, either increase the mobile menu breakpoint to 1100, you can do this at Customize > Theme Settings > Responsive Menu Collapse or you can try the following in Additional CSS/Custom CSS:
.main-navigation { max-width: none !important; }
February 14, 2019 at 9:44 am #12084
BrunoParticipantHI, Andrew,
DONE!!!! :-)) Now it as I would, infinitelly Thank youHave a nice day and Best regards
BrunoFebruary 14, 2019 at 9:45 am #12085
Andrew MisplonKeymasterSuper 🙂 Glad to hear that helped.
All the best.
February 14, 2019 at 10:19 am #12086
BrunoParticipantHI, Andrew, excuse me I have anohter question: on mobie view the screen move like You can se here:
http://demo3.brunotominetti.com/VID_20190214_110137.webmsd.webmTere is something to fix that?
Really Thank You again
Have a nice day and Best regards
BrunoFebruary 14, 2019 at 11:11 am #12087
BrunoParticipantHI Andrew, I solved Ihope moving the css settings to anther installation.
I will sen You th resut when doneReally Thank You again
Have a nice day and Best regards
BrunoFebruary 14, 2019 at 12:16 pm #12088
Andrew MisplonKeymasterHi Bruno
Are we sure this doesn’t happen with every website? It might be more obvious with Ultra because the background colour behind the container is the same as the footer background, a dark grey.
body { overflow-x: hidden; }
Above is usually what we’d use for a problem like this but I don’t think this is a normal overflow issue. For example, does github.com do the same thing on your phone, just with a white background?
February 14, 2019 at 2:18 pm #12089
BrunoParticipantI Andrew, not the problem was because of a wrong txt edition, copied from the old site, right now is correct; I’ woring on, I will show You the result
Thank You again
Have a nice day and Best regards
BrunoFebruary 14, 2019 at 2:44 pm #12090
Andrew MisplonKeymasterSuper 🙂 Glad all is normal now.
- AuthorPosts
You must be logged in to reply to this topic.