that and you may need to add
HTML Code:
div#menu1 ul.rMenu {
background: transparent;
}
remember to think of HTML elements as layers of paper. The parent layer is at the bottom and the children on top. We look top down. You can decide what each layer's color is so if you have
HTML Code:
<div id="menu1" class="menu-small-menu-container">
</div>
the <div> is the first layer - if you color this blue or use an image , that is what you will see, but what if you add a UL to it so you have
HTML Code:
<div id="menu1" class="menu-small-menu-container">
<ul id="rmenu2" class="clearfix rMenu-hor rMenu">
</ul>
</div>
If you add a color or image to the UL, it will cover the DIV's color/image. Then you add an LI
HTML Code:
<div id="menu1" class="menu-small-menu-container">
<ul id="rmenu2" class="clearfix rMenu-hor rMenu">
<li id="menu-item-11">
</li>
</ul>
</div>
and it's color/image will overlay the UL's (which is overlaying the DIV's). Then you have a <A>
HTML Code:
<div id="menu1" class="menu-small-menu-container">
<ul id="rmenu2" class="clearfix rMenu-hor rMenu">
<li id="menu-item-11">
<a href="mydomain.com/page1">
</a>
</li>
</ul>
</div>
and finally a SPAN
HTML Code:
<div id="menu1" class="menu-small-menu-container">
<ul id="rmenu2" class="clearfix rMenu-hor rMenu">
<li id="menu-item-11">
<a href="mydomain.com/page1">
<span>HOME</span>
</a>
</li>
</ul>
</div>
both of which can have a color or image so
the SPAN will be the most important
the A comes next
then the LI
then the UL
then the DIV
The amount of space each takes up will also effect what you see.
Hope this helps.