I'm having trouble with my page menu bar. My goal is to have it span the width of the header/site (900px). That seems to be working just fine, but when I applied the css to achieve this goal, I suddenly had a spacing issue with the child menu items. If you look at my attached image, there is extra background or spacing to the right of the second level items, which causes the third level items to be pushed further to the right. Any ideas on how to fix this?
Here are the CSS inserts I'm using for the menu:
Code:
/* Menus */
div#menu1 {
border: none;
width: auto
}
div#menu1 ul.rMenu
{
border: none;
background: #fff;
width: 895px;
margin-right: auto;
margin-left: auto;
}
ul.rMenu li a {width:166px; text-align:center;}
ul.rMenu,
div#menu1 {
height:25px;
margin-top:0px;
background: #fff;
}
I'm using WordPress 3.3.1 and Atahualpa 3.7.3, and Chrome (on a Mac) for my browser, if that helps.
Thanks in advance!
~Sami
