HTML
Código:
<html>
<head>
<link href="contenidos.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="contenedor">
<div id="menu"></div>
<div id='contenido'>
<div id='galeria_fotos'>
>>> columna anterior
<ul id='fotos_anteriores'>
<li><img src='images/primera.jpg' /></li>
</ul>
>>> imagen principal
<div id='imagen_principal'>
<a href='fotos/zoom/foto1.jpg' class='zoom'>
<img src='fotos/foto1.jpg' />
</a>
</div>
>>> columna posterior
<ul id='fotos_siguientes'>
<li><img src='fotos/small/foto2.jpg' title='foto2.jpg' /></li>
<li><img src='fotos/small/foto3.jpg' title='foto3.jpg' /></li>
</ul>
</div>
</div>
<div id="pie"></div>
</div>
</body>
</html>
CSS
Código:
ul#fotos_anteriores, ul#fotos_siguientes {
padding: 0px;
margin: 0px;
float: left;
width: 110px;
list-style-type: none;
background-image: url('images/fondo_gris.png');
background-repeat: repeat;
overflow: hidden;
}
ul#fotos_anteriores li, ul#fotos_siguientes li {
margin: 5px 0px;
text-align: center;
}
div#imagen_principal {
width: 800px;
height: 500px;
margin: 0px 15px;
float: left;
text-align: center;
}
div#imagen_principal img {
margin: 0px auto;
}
La cuestión es que puesto así, en plano, funciona correctamente. Pero es que es una galeria que genero de forma dinámica según las fotos que se suban y se guardan en una base de datos, y precisamente al generarlo mediante php es cuando falla, excepto en internet explorer que va bien :S
En IE funciona por "text-align: center;"
Y en el resto debiera funcionar con "margin: 0px auto;" pero no es el caso...y no entiendo por qué.
Un saludo.