Hola, tengo estos estilos CSS, le podrian echar un ojo y decirme que me falta ? porque me quedan mal
,
Me queda un espacio blanco entre POSTS y el HEADER, asi como en esta imagen:
http://img119.imageshack.us/my.php?image=esquemapagvd5.png
agradeceria si pudieran ayudarme, muchas gracias, saludos!
Código:
body{background-color:#FFFFFF; font:80%; text-align:center}
#posts {background: #FFFFFF url(Images/fondito.png) repeat-x;
float: right;
width:550px;
text-align:left;
color: #FFFFFF;
}
#container {
width:800px;
text-align:left;
margin:0 auto;
}
#header {
height:auto;
background-image:url(Images/header_index.gif);
background-repeat:repeat-x;
width:800px;
}
#menuv {
border: 2px solid #00AA00;
border-width: 0px 1px 0 1px;
width: 245px;
font: 80% "Trebuchet MS", Arial, Helvetica, sans-serif;
float:left;
}
#menuv ul, li {
list-style-type: none;
}
#menuv ul {
margin: 0;
padding: 0;
}
#menuv li {
border-bottom: 3px solid #009933;
}
#menuv a {
text-decoration: none;
color: #FFFFFF;
background: #66CC33;
display: block;
padding: 3px 6px;
width: 245px;
}
#menuv a:hover {
background: #66CC66;
border:3px solid #009933;
border-width:3px 3px 0px 3px;
}
#header_wraper {
width:100px;
height:145px;
postition:relative;
top:0px;
left:1px;
overflow:visible;
z-index:2;
}
#footer {
margin:0;padding:5px 10px; width:800px;clear:both;}
#footer_left{
width:50%;
height:15px;
background: #CCFFCC url(Images/footer.gif) repeat-x;
text-align: left;
word-spacing:-0.1em;
padding: 10px 0px 10px 0px;
color: #FFFFFF;
text-decoration:none;
font: bold Arial, Helvetica, sans-serif;
font-size:80%}
#footer_right{
width:400px;
height:15px;
background: #CCFFCC url(Images/footer.gif) repeat-x;
text-align: left;
word-spacing:-0.1em;
padding:0;
color: #FFFFFF;
text-decoration:none;
font: bold Arial, Helvetica, sans-serif;
font-size:80%;
}
a {
outline: none;
}
.rollover {
float: right;
display: block;
width: 47px;
height: 28px;
background: url(Images/logo_emp.gif) no-repeat;
text-indent: -9999px;
}
a.rollover:link, a.rollover:visited, a.rollover:active {
background: url(Images/logo_emp.gif) no-repeat;
}
a.rollover:hover {
background-position: -47px;
}
.titulopost{
background: url(Images/titulo.gif) no-repeat;
padding:35px 0px 20px 0px;
text-align:center; font:Arial, Helvetica, sans-serif bold; color: #E9E9E9}
#noticias {width:250px;
height:300px;
border:1px 1px 1px 1px #CCCCCC dashed;
display:block;
float:left;
clear:both;
overflow:scroll;}
y organizado de esta manera:
Código HTML:
<body><div id="container">
<div id="header"><div id="header_wraper"><img src="Images/logo.png" /></div></div>
<div id="menuv">
<ul>
<li>
<div align="left"><a href="#menuv"><strong>Foro</strong></a></div>
</li>
<li>
<div align="left"><a href="#menuv"><strong>Juegos</strong></a></div>
</li>
<li>
<div align="left"><a href="#menuv"><strong>Chat</strong></a></div>
</li>
<li>
<div align="left"><a href="#menuv"><strong>Fotos</strong></a></div>
</li>
</ul></div>
<div id="noticias">
<? PHP?>
</div><div id="posts">
<table width="450" border="0" align="center">
<tr>
<td width="450"><div class="titulopost"><?PHP?></div></td>
</tr>
</table><?PHP?>
</div>
<table id="footer" width="100%" border="0" cellspacing="0">
<tr>
<td id="footer_left"><a href="#" class="footer_link"> Foro-</a><a href="#" class="footer_link">Fotos-</a><a href="#" class="footer_link">Juegos-</a><a href="#" class="footer_link">Chat-</a></td>
<td id="footer_right">
<a href="#" title="Chubicum Ideas" class="rollover">chubicum</a></td>
</tr>
</table>
</div>
</body>