Ver Mensaje Individual
  #1 (permalink)  
Antiguo 24/11/2010, 19:20
The_Outsider
 
Fecha de Ingreso: noviembre-2010
Mensajes: 6
Antigüedad: 13 años, 5 meses
Puntos: 0
Problema con posicionamiento

Hola soy algo nuevo con el diseño con css , creo q estoy planteando mal la forma con la que busco que tres divs esten en fila dentro de un div mas grande, por ejemplo tome un div "Banner" donde dentro hay 3 divs (B_P1,B_P2 y B_P3) B_P1 tiene float:left , B_P3 tiene float:right y para q esten en la misma linea los divs use la propiedad Display:inline-block , anda todo perfecto pero cuando lo ejecuto en chrome se desarma todo.aca adjunto el css y el html.
div {
margin:0px;
padding:none;
border:none;
}
#B_P1 , #B_P2 , #B_P3 {Display:inline-block;}
#Banner{
margin:0px auto;
width:100%;
height:168px;
}
#B_P1 , #B_P2 , #B_P3{height:100%;}
#B_P1{
float:left;
width:83px;
background-image:url(Banner_1.jpg);
background-repeat:no-repeat;
background-color:#000;
}
#B_P2{
width:917px;
background-image:url(Banner_2.jpg);
background-repeat:repeat-x;
}
#B_P3{
float:right;
width:91px;
background-image:url(Banner_3.png);
}

Html:
<Body>
<div id="Banner">
<div id="B_P1">
</div>
<div id="B_P2">
</div>
<div id="B_P3">
</div>
</div>
</Body>