Hola a todos,
tengo un problema con la visualización de una página:
En IE7 se reducen la culmunas central y derecha dejando un espacio.
En Moz a parte de reducir las fuentes de los headers, coloca toda la maquetación hacia la izquierda pero los espacios entre columnas son correctos.
Código PHP:
/* background height */
html {min-height: 100%;height: auto;}
BODY {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color:white;
margin: 6px 0px;
text-align: center;
background:#000000 url(images/bg.jpg) no-repeat bottom;
}
/* headers */
h1, h2, h3, h4, h5, h6{margin:0px;}
h2{
text-align:left;
margin-bottom:4px;
}
h3{
background:#FF0066;
text-align:left;
padding: 4px;
font-weight:bold;
}
h4{
text-align:left;
padding: 0px;
margin-top:8px;
}
h5{
text-align:right;
padding: 0px;
margin:2px 0px 8px 0px;
}
h6{
font-weight:normal;
text-align:center;
padding: 0px;
margin:4px 0px;
}
/* div 2 columns*/
#container{
text-align: left;
margin: 0px;
padding: 0px;
width:700px;
}
#head{
width:700px;
height:200px;
margin-bottom: 6px;
text-align:center;
}
#body{
margin: 10px 0px;
}
/* div lateral right*/
#lateral{
text-align:left;
width: 110px;
margin: 0px;
float:right;
padding:8px;
background:#FA6494 url(images/bgright.jpg) repeat-x top;
}
#lateral ul{
margin:0px;
padding:0px;
list-style:none;
}
#lateral li{
padding:0px;
margin-bottom:14px;
display:block;
}
/* text style and list */
.text{
width:380px;
margin-bottom: 14px;
margin-left: 160px;
margin-right:auto;
padding: 10px 12px;
background:url(images/bgtext.jpg) repeat-y center;
}
.text ul{
margin:0px;
padding:0px;
}
.text li{
list-style:none;
margin:6px 0px;
padding:0px;
}
/* menu left */
#menu{
width:150px;
height:auto;
float:left;
background:#FA6494 url(images/bgmenu.jpg) no-repeat top;
text-align: left;
margin:auto;
padding:6px 0px;
}
#menu ul {
margin:0px;
padding: 0px;
list-style-type: none;
}
#menu li {
width:150px;
height:auto;
margin:2px 0px;
}
#menu a {
color: white;
font-size:14px;
font-weight: bold;
text-decoration: none;
padding: 6px 12px;
display: block;
}
#menu a:hover {
background:#FF6699 url(images/bgmenub.jpg) repeat center;
}
Text es la columna central, Menu la de izquierda y Lateral la dela derecha.
Muchas gracias.