papyrus theme menu bars

Please post a link to your site so we can examine the code.

sorry
the site is https://www.yourgreenflooring.com
and I seem to of solved problem #1 so I am only worried about #2
Thanks again

Your menu items have a hover style applied to them that adds padding to the top, making the <a> element taller and forcing the second line of menu items out of its way. It’s not an attractive style, for sure. Here is the offending code:

#nav a:hover, #nav .current_page_item a {
padding: 25px 13px 13px;
}

That code declares 25 pixels of padding on top, the first 13px affects the left and right sides, the other 13px is the bottom padding. I would replace this hover effect with something more pleasing to the eye – perhaps a color change, or an underline – something that doesn’t alter the size of the <a> element. Bold text is larger than normal text, so that will change the size of <a>.

I tried making the top padding less but it does not seem to change. Any tap i hover over moves the text down and moves the tab below it over to make roo. Is there a way to make the space for the tabs wider so they would all fit in a single line?

I tried making the top padding less but it does not seem to change. Any tab I hover over moves the text down and moves the tab below it over to make room. Is there a way to make the space for the tabs wider so they would all fit in a single line?

I would eliminate the padding in nav a:hover and be sure to refresh your browser.

You can make your #nav wider, but it comes with complications. It will now be wider than the #page div below it, so you have to play with the alignment. If you decide to make #page wider too then the background image you are using for the content is only 760px wide, so that won’t fill the increased space.

Then you get to see what’s inside Pandora’s box ??

getting rid of the padding worked! Thank you very much!

Nice, can you mark this as resolved?