1
I can not get a menu laid out horizontally on my theme. I am trying to put it where the horizontal menu is now but it shows up vertically. My site is
http://www.craigkin.com.
(I am using firefox to test, of course it wont work in Ie)
I also tried it in the default theme and it worked so it must be my theme.
Here is the code I am testing:
<ul id="nav">
<li><a href="#">Percoideia>
<ul>
<li><a href="#" class="daddy">Remorasa>
<ul>
<li><a href="#" class="daddy">Echeneisa>
<ul>
<li><a href="#">Sharksuckera>li>
<li><a href="#">Whitefin Sharksuckera>li>
ul>
li>
<li><a href="#" class="daddy">Phtheirichthysa>
<ul>
<li><a href="#">Slender Suckerfisha>li>
ul>
li>
<li><a href="#" class="daddy">Remoraa>
<ul>
<li><a href="#">Whalesuckera>li>
<li><a href="#">Spearfish remoraa>li>
<li><a href="#">Marlinsuckera>li>
<li><a href="#">Remoraa>li>
<li><a href="#">Ceylonese remoraa>li>
ul>
li>
<li><a href="#" class="daddy">Remorinaa>
<ul>
<li><a href="#">White suckerfisha>li>
ul>
li>
<li><a href="#" class="daddy">Rhombochirusa>
<ul>
<li><a href="#">R. osteochira>li>
ul>
li>
ul>
li>
<li><a href="#" class="daddy">Tilefishesa>
<ul>
<li><a href="#">Caulolatilusa>li>
<li><a href="#">Lopholatilusa>li>
<li><a href="#">Malacanthusa>li>
ul>
li>
<li><a href="#" class="daddy">Bluefishesa>
<ul>
<li><a href="#">Pomatomusa>li>
<li><a href="#">Scombropsa>li>
<li><a href="#">Sphyraenopsa>li>
ul>
li>
<li><a href="#" class="daddy">Tigerfishesa>
<ul>
<li><a href="#">Amniatabaa>li>
<li><a href="#">Bidyanusa>li>
<li><a href="#">Hanniaa>li>
<li><a href="#">Hephaestusa>li>
<li><a href="#">Lagusiaa>li>
<li><a href="#">Leiopotherapona>li>
<li><a href="#">Mesopristesa>li>
<li><a href="#">Pelatesa>li>
<li><a href="#">Pelsartiaa>li>
<li><a href="#">Pingallaa>li>
<li><a href="#">Rhyncopelatesa>li>
<li><a href="#">Scortuma>li>
<li><a href="#">Syncomistesa>li>
<li><a href="#">Terapona>li>
ul>
li>
ul>
li>
<li><a href="#">Anabantoideia>
<ul>
<li><a href="#" class="daddy">Climbing perchesa>
<ul>
<li><a href="#">Anabasa>li>
<li><a href="#">Ctenopomaa>li>
ul>
li>
<li><a href="#" class="daddy">Labyrinthfishesa>
<ul>
<li><a href="#">Belontiaa>li>
<li><a href="#">Bettaa>li>
<li><a href="#">Colisaa>li>
<li><a href="#">Macropodusa>li>
<li><a href="#">Malpuluttaa>li>
<li><a href="#">Parosphromenusa>li>
<li><a href="#">Sphaerichthysa>li>
<li><a href="#">Trichogastera>li>
<li><a href="#">Trichopsisa>li>
ul>
li>
<li><a href="#">Kissing gouramisa>li>
<li><a href="#">Pike-headsa>li>
<li><a href="#">Giant gouramisa>li>
ul>
li>
<li><a href="#">Gobioideia>
<ul>
<li><a href="#">Burrowing gobiesa>li>
<li><a href="#">Dartfishesa>li>
<li><a href="#">Eellike gobiesa>li>
<li><a href="#">Gobiesa>li>
<li><a href="#">Loach gobiesa>li>
<li><a href="#">Odontobutidaea>li>
<li><a href="#">Sandfishesa>li>
<li><a href="#">Schindleriidaea>li>
<li><a href="#">Sleepersa>li>
<li><a href="#">Xenisthmidaea>li>
ul>
li>
ul>
css
#nav, #nav ul {
float: left;
width: 36em;
list-style: none;
line-height: 1;
background: white;
font-weight: bold;
padding: 0;
border: solid #eda;
border-width: 1px 0;
margin: 0 0 1em 0;
}
#nav a {
display: block;
width: 10em;
width: 6em;
color: #7C6240;
text-decoration: none;
padding: 0.25em 2em;
}
#nav li {
float: left;
padding: 0;
width: 10em;
}
#nav li ul {
position: absolute;
left: -999em;
height: auto;
width: 14.4em;
width: 13.9em;
font-weight: normal;
border-width: 0.25em;
margin: 0;
}
#nav li li {
padding-right: 1em;
width: 13em
}
#nav li ul a {
width: 13em;
width: 9em;
}
#nav li ul ul {
margin: -1.75em 0 0 14em;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
left: -999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
left: auto;
}
#nav li:hover, #nav li.sfhover {
background: #eda;
}