How do I adjust the width of the nav dropdowns?
-
-
- Yetisketch
- Newbie
- Posts: 8
- Thanks: 0
-
Hi, thanks for your time and consideration.
I'm running Joomla 1.5.15
I just downloaded the Afterburner template, and I'm having an issue with the width of the main menu dropdowns in the nav position.
They don't expand to cover the entire title of the submenu item.
To view the issue, go to http://education.yetzerstudio.com and rollover Assignment Uploads and Downloads.
You will see the green sub menu not expanding enough to display the entire title.
Thanks in advance for your help.
Brian
-
-
-
- Sean Habing
- Elite Rocketeer
- Posts: 1028
- Thanks: 1
-
Hello Brian,
You will need to modify the following code in your dark2.css line 127.
#nav li ul { border-color:-moz-use-text-color #3F7300 #3F7300; border-style:none solid solid; border-width:0 1px 1px; left:-999em; margin-left:-1px; position:absolute; width:170px; }
you will need to change the width to the appropriate size for your drop down. 100% width might work.
Hope this helps
Cheers
-
-
-
- Yetisketch
- Newbie
- Posts: 8
- Thanks: 0
-
Hi Sean,
Changing the width from 170px to 100% is the correct solution.
Thanks for the help!
Brian
-
-
-
- Sean Habing
- Elite Rocketeer
- Posts: 1028
- Thanks: 1
-
Hi Brian,
Great! If you have any more issues let me know.
Cheers
-
-
-
- Carl Uttley
- Newbie
- Posts: 3
- Thanks: 0
-
Hi, I've experienced the same problem with my site using the afterburner theme. I tried the fix above but that did not work for me. The dropdown is not wrapping to accommodate one or two lengthy menu item titles.
The site I have is for my employer and the issue is occurring on areas which are protected with logins.
Happy to provide you with a temporary login account if that would help you provide advice on the issue.
Many thanks.
-
-
-
- Geoff R
- Sr. Rocketeer
- Posts: 231
- Thanks: 0
-
Carl, if you are still configuring this perhaps you could leave the width as is (170px), but allow the text to wrap. Try this:
#nav li li a, #nav li li.active a, #nav li li a:hover {
height: auto;
line-height: 1.2em;
padding: 7px 10px;
}
Have only tested it on Safari - but should work elsewhere, I think!
Cheers,
Geoff
-
-
-
- roma64
- Hero Rocketeer
- Posts: 269
- Thanks: 10
- Owner of SimplerWebs
-
Sorry to jump in but I am having similar problem. I am using style2 but I was able to setup my own custom css file and that is what I am using.
Site in question: http://simplerwebs.com
I was able to increase the width of my submenu using the below code but I only have a small problem where I cannot manage to have the border (bottom) to go all the way.
In my custom css file, I have added the following lineI set the width to 110% because using 100% did not work for me and I don't really want to wrap the menu. Again the changes worked for me except for the last submenu where you can see the border (green) does not go all the way and complete its submenu.#nav li li a, #nav li.active li a { font-weight: normal; width: 110%; }
Again, sorry to jump in and your assistance would be very much appreciated - A Web Design, SEO and Marketing Company
-
-
-
- citationgurus
- Newbie
- Posts: 6
- Thanks: 0
- Hey guys I am having this issue with voxel and cant seem to find the right css to edit to force it to wrap so it is cutting off my text and not wrapping. I am building a demo site on joomla 2.5 with voxel responsive template and don't really know much about css. Which file do I need to edit to get the dropdowns to wrap?
-
Time to create page: 0.077 seconds