November 29th, 2012, 10:44 AM
|
|
Registered User
|
|
Join Date: May 2012
Posts: 9
Time spent in forums: 2 h 51 m 18 sec
Reputation Power: 0
|
|
|
Horizontal List is causing cell to move down?
Will explain this as best as I can.
I am including a horizontal CSS menu in a website I am making for a friend, when I simply use text everything is fine, as in picture below. This is a cropped screenshot btw.
However when I add the list I get this.
see how the entire cell has moved down?
here is my code.
the CSS is:
Code:
body,
html {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
margin:0;
padding:0;
color:#000;
background-image:url(../images/site_bg.png);
background-repeat:repeat-x;
}
#container {
width:950px;
margin:0 auto;
text-align:center;
}
/*End Global Styles Here*/
/*Begin Head Styles Here*/
#head {
height:192px;
background:#ebebeb;
}
/*Begin Nav Styles Here*/
#nav {
height:47px;
background:#ef4036;
}
#nav li {
display:inline;
}
#nav li a {
color:#FFF;
font-size:16px;
font-weight:bold;
text-decoration: none;
}
/*End Nav Styles Here*/
The Menu using list:
Code:
<div id="nav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</div>
And Without:
Code:
<div id="nav">
Main Navigation Here
</div>
nav.php is loaded into a cell head.php as a php include.
Thank You in advance
Rab
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
