Hola, estoy creando una pequeña web, es la siguiente:
http://www.antera-solutions.com/weboss/
Los problemas son:
1- La imagen de cabecera que se supone que es de fondo nos e muestra entera.
2- En MF el border 1px no coge nada de contenido y tenia que coger todo
3- En IE cuando pulso sobre un boton del menu sale 1px abajo que separa la imagen del menu mientras que con MF no pasa eso.
Código:
Cita: <div id="contenedor">
<div id="header">
<div id="logo"><img src="img/logo-1.jpg" alt="" width="300" height="100" /></div>
<div id="logueo">Bienvenido invitado <a href="#" class="logueo">Logueate</a> o <a href="#" class="logueo">Registrate</a></div>
</div>
<div id="secciones">
<ul class="menu">
<li><a href="#" class="sec">INICIO</a></li>
<li><a href="#" class="sec">HERRAMIENTAS</a></li>
<li><a href="#" class="sec">UTILIDADES</a></li>
<li><a href="#" class="sec">TUTORIALES</a></li>
<li><a href="#" class="sec">BLOG</a></li>
<li><a href="#" class="sec">FORO</a></li>
<li><a href="#" class="sec">CONTACTA</a></li>
</ul>
</div>
</div>
style.css:
Cita: #header {
margin: auto;
padding: 0px;
width: 700px;
text-align: left;
background-image: url(img/cabecera.jpg);
background-repeat: repeat-y;
display: block;
margin-bottom: 1px;
}
#logo {
margin: auto;
padding: 0px;
width: auto;
text-align: left;
float: left;
}
#logueo {
margin: auto;
padding-top: 10px;
padding-right: 15px;
width: auto;
text-align: right;
float: right;
font-family: Arial;
font-size: 0.7em;
color: #FFFFFF;
background-image: url(img/cabecera.jpg);
background-repeat: repeat;
}
a.logueo{
text-decoration: none;
color: #FFFFFF;
}
a.logueo:hover{
text-decoration: underline;
color: #FFFFFF;
}
#secciones {
border-bottom: 5px solid #666666;
border-top: 5px solid #666666;
width: 700px;
float: left;
background-color: #888888;
height: auto;
}
a.sec{
background-color: #888888;
font-size: 0.7em;
font-family: Arial;
text-align: center;
display: inline;
color: #FFFFFF;
text-decoration: none;
border-right: 1px solid #FFFFFF;
float: left;
display: inline;
padding-bottom: 5px;
padding-top: 5px;
padding-left: 10px;
padding-right: 10px;
}
a.sec:hover{
background-color: #58A9C0;
font-size: 0.7em;
border-right: 1px solid #FFFFFF;
font-family: Arial;
text-align: center;
color: #FFFFFF;
text-decoration: none;
display: inline;
float: left;
padding-bottom: 5px;
padding-top: 5px;
padding-left: 10px;
padding-right: 10px;
}
.menu {
list-style: none;
display: inline;
}
.menu li {
list-style: none;
display: inline;
}
Haber si me hechais una mano
Un saludo