buenas:
he creado un estilo css. El problema es que se descuadra todo y lo que es peor, falla al generar contenido dinámicamente con php.
El código es el siguiente
#contenedor { /* contenedor genérico */
width:1100px;
text-align:center;
margin:auto;
font-family:helvetica;
font-size:10pt;
background:#F6F6F6;
border:1px solid #000;
}
#logo { /* contenedor del logo */
margin-top:10px;
margin-left:10px;
margin-right:10px;
margin-bottom:10px;
padding-top:0px;
padding-left:0px;
padding-right:0px;
padding-bottom:0px;
width:765px;
height:175px;
}
#multi { /* esto pretende ir a la derecha del logo */
position:absolute;
top:9px;
left:880px; /* tuve que meterle posicionamiento absoluto porque no hay manera de que coloque a la derecha, si no que se coloca debajo */
margin-top:10px;
margin-left:0px;
margin-right:10px;
margin-bottom:10px;
padding-top:0px;
padding-left:0px;
padding-right:0px;
padding-bottom:0px;
background:#F6F6F6;
width:295px;
height:175px;
}
#subcontenedor {
margin-top:10px;
margin-left:10px;
margin-right:10px;
margin-bottom:10px;
padding-top:0px;
padding-left:0px;
padding-right:0px;
padding-bottom:0px;
background:#FFFFFF;
width:1080px;
border:1px solid #000;
}
/* barra izquierda */
#contCategorias {
margin-top:10px;
margin-left:10px;
margin-right:10px;
margin-bottom:10px;
padding-top:0px;
padding-left:0px;
padding-right:0px;
padding-bottom:0px;
width:260px;
background:#F6F6F6;
border:1px solid #000;
border-radius:5px;
}
#categoriasImg { /* contenedor de la imagen */
margin-top:10px;
margin-left:10px;
margin-right:10px;
margin-bottom:10px;
width:240px;
background:#F6F6F6;
border-radius:5px;
}
#categorias { /* dentro de aquí va el contenido generado por php */
margin-top:10px;
margin-left:10px;
margin-right:10px;
margin-bottom:10px;
padding-top:0px;
padding-left:0px;
padding-right:0px;
padding-bottom:0px;
width:240px;
background:#F6F6F6;
border:1px solid #000;
border-radius:5px;
}
#categorias img { /* ahora está como img, pero también probé con div
float:left;
margin-top:2px;
margin-left:8px;
margin-right:8px;
margin-bottom:2px;
padding-top:0px;
padding-left:0px;
padding-right:0px;
padding-bottom:0px;
width:100px;
height:100px;
border:1px solid #000;
border-radius:5px;
}
el problema con el código de las categorías es que las imágenes "flotan" por encima de los divs donde se contienen si se generan por php
while(isset($_SESSION["usrCats"][$i])) {
$id=$_SESSION["usrCats"][$i]->get_id_categoria();
$nombre=$_SESSION["usrCats"][$i]->get_nombre(); ?>
<a href="#" onclick="ver(<?=$id;?>)">
<img src="./imgCats/<?=$id;?>.jpg" WIDTH="100" height="100" alt="<?=$nombre;?>" border="0" >
</a>
<?php
$i++;
}?>
alguien puede echar una mano?
gracias!
EDIT:
incluyo las imágenes de los problemas que hay con esta CSS:
