The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Resolved] Best approach to creating a horiz menu bar? Reply To: Best approach to creating a horiz menu bar?


Greetings Paul,

I’ve been working with the menu you created and I really like the way it functions. I’ve made a few changes and have tried to make others, but am not quite getting the results I want. The menu is here.

I’ve tried to set the text down a bit (vertically centered) in the boxes and have attempted that by adjusting the top and bottom margins but am not doing anything but making the boxes bigger, or having no effect.

I’ve tried adjusting the font weight and was able to do that and compensate for the added size by adjusting the margins, but I cannot get the height to be 20px which is what they need to be.

I am having trouble adjusting the positions of the drop downs. For example, the <li> “History” appears to be both under and over the <li class="active"> “About Us” as the top border of the former and bottom border of the latter are missing. Also, the top inner border for the “History” button appears to be under the top nav button “Discover”. Of course this is inherent to all sub navs. The tert navs are overriding the right edge of their adjacent buttons and I’ve tried to adjust this by adding margin values to the .tert-nav > li, .tert-nav > li a { but I get some very strange gaps and extra “borders” no matter the value set for the left margin. (1px or 2 px).

Can individual width values be given to the upper nav buttons such as the “about Us” button and if so, what would be the best way to do that?