Transparent image not appearing in menu
My page is here.
My drop down navigation css is here.
I'm trying to add a transparent png image, image here, to the drop down portion of the menu. However, it's not appearing.
I thought adding a "suboptions" class to the dropdown ul would do the trick, along with setting CSS for that dropdown, but it doesn't seem to be working.
HTML in question:
<ul class="suboptions">
<li>&l开发者_StackOverflowt;a href="/faqs" title="CET Color Frequently Asked Questions">F.A.Q.'s</a></li>
<li><a href="/install" title="CET Color Installation & Site Prep">Installation</a></li>
</ul>
CSS in question:
#menu li ul.suboptions {
background-image: url(/images/bkg_nav.png) !important;
background-color: transparent !important;
}
Any suggestions? Thanks!
you have float for the <li>
You have to clear the float, after <li>
or apply bg image for li.
EX:1
add this to your css
#menu li ul.suboptions:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#menu li ul.suboptions {
display: inline-block;
}
html[xmlns] #menu li ul.suboptions {
display: block;
}
* html #menu li ul.suboptions {
height: 1%;
}
EX2:
add this to #menu li ul.suboptions li
class
#menu li ul.suboptions li {
background-image: url(/images/bkg_nav.png) !important;
background-color: transparent !important;
}
精彩评论