0
#navigation {
width: 778px;
height: 31px;
background-image: url('images/navigation.jpg');
background-repeat: repeat-x;
}
#menu {
padding: 0px;
margin: auto;
white-space: nowrap;
background-repeat: no-repeat;
height: 31px;
width: 778px;
list-style-type:none;
}
* html .menu{
display:inline; /* for IE only */
width:1px; /* IE will expand to fit menu width */
padding:0 1px; /* fix bug in IE for border spacing */
}
#menu li{
display:inline; /*This is the code that IE can see, but the other browsers overide*/
}
html>body #menu li{
display:table-cell; /*Display table-cellThis is the code that IE can not see and FF and other browsers can see*/
}
#menu a {
width:auto;
display:block;
color:#c0e0ef;
text-decoration:none;
float:left;
}
#Home{
width:83px;
height: 32px;
display:block;
background-image: url('images/home.jpg');
background-repeat: no-repeat;
color: #f0f0f0;
text-decoration:none;
}
#Forum{
width:83px;
height: 32px;
display:block;
background-image: url('images/forum.jpg');
background-repeat: no-repeat;
color: #f0f0f0;
text-decoration:none;
}
#Contact{
width:83px;
height: 32px;
display:block;
background-image: url('images/contact.jpg');
background-repeat: no-repeat;
color: #f0f0f0;
text-decoration:none;
}
#menu a:hover {
border-top: 4px solid #bbd7ef;
}
.container {text-decoration:none;}
* html .container {display:inline-block;}
<ul id="menu">
<li><a href="index.php" id="Home"></a></li>
<li><a href="forum.php" id="Forum"></a></li>
<li><a href="contact.php" id="Contact"></a></li>
</ul>
Assuming all the names of the images are correct (They are) why wouldn't this navigation be showing up? I wrote the code pretty much myself so I could be mistaken but it seems like it should work.
Edited by Bouzy210, 03 March 2008 - 10:46 PM.
