im having trouble with the formatting part of it, i have the list and thats how it appears on my screen as well, can someone help out and take a look at what i have
here is my html
<div id="wrapper">
<div id="header"> <a href="index.htm"></a>
<h1 class="style1"></h1>
<h1 class="style2"> </h1>
<h1 class="style2">Tech Central </h1>
</div>
<div id="multi_drop_menus">
<ul>
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="">Computers</a>
<ul>
<li><a href="Eesktop.html">Desktops</a></li>
<li><a href="Laptop.html">Laptops</a></li>
<li><a href="Netbook.html">Netbooks</a></li>
<li><a href="allinone.html">All-In-One</a></li>
</ul>
<li><a href="">Televisions</a>
<ul>
<li><a href="">Plasma</a></li>
<li><a href="">LCD</a></li>
<li><a href="">DLP</a></li>
</ul>
</li>
<li><a href="">Accessories</a>
<ul>
<li><a href="">Television Stands</a></li>
<li><a href="">Computer Desks</a></li>
<li><a href="">Monitors</a></li>
<li><a href="">Computer Parts</a></li>
</ul>
</li>
<li><a href="">On Sale</a>
</li>
</ul>
</div>
</div>
here is my css
div.multi_drop_menus * {
margin:0; padding:0;
}
div.multi_drop_menus {
behavior:url(../../lib/js_tools/csshover.htc);
font-family: arial, sans-serif;
font-size:.8em;
margin:0px 0 10px 0px;
background-color:transparent;
}
div.multi_drop_menus ul {
border-left:1px solid #CCB;
display:inline;
}
div.multi_drop_menus li {
background-color:#E0E7C9;
border-right:1px solid #CCB;
}
div.multi_drop_menus li:hover {
background-color:#F0F7D9;
}
div.multi_drop_menus a {
color:#776;
padding:.2em 5px;
}
div.multi_drop_menus a:hover {
color:#443;
}
div.multi_drop_menus ul li ul {
width:12em;
}
div.multi_drop_menus li li {
background-color:#E0E7C9;
border-bottom:1px solid #CCB;
}
div.multi_drop_menus ul li ul li ul {
border-top:1px solid #CCB;
top:-1px;
}
div.multi_drop_menus li li li {
background-color:#EEB;
}
div.multi_drop_