Hola Compañeros, estuve buscando un tema que hablara de esto pero no lo encontre, así que decidí postearlo.
Tengo 3 imagenes que deseo desplegarlas en div, pero quiero que se visualicen sin ningun espacio entre ellas, en firefox y opera se ve excelente, en IE(como de costumbre) no, me deja un pequeño espacio entre cada div y no encuentro la razón.
La estructura de la página es la siguiente:
Cita: <div id="centro_index">
<DIV id="top_centro"></DIV>
<div id="form_centro">
<div id="imagen_centro"></div>
</div>
<div id="bottom_centro"></div>
</div>
el css que utilizo es el siguiente:
Cita: #centro_index
{
width:100%;
height:340px;
margin-top:170px;
display:table;
}
#centro_index #top_centro
{
margin:0px;
padding:0px;
border:0px;
height:8px;
background-image:url(../imagenes/top_login.jpg);
background-repeat:no-repeat;
background-position:right;
width:100%;
margin-bottom:0px;
}
#form_centro
{
margin-top:0px;
height:314px;
width:100%;
border:0px;
margin-bottom:0px;
}
#form_centro #imagen_centro
{
margin-top:0px;
margin:0px;
padding:0px;
border:0px;
height:313px;
background-image:url(../imagenes/center_login.jpg);
background-repeat:no-repeat;
background-position:top right;
width:354px;
float:right;
margin-bottom:0px;
}
#centro_index #bottom_centro
{
margin-top:0px;
margin:0px;
padding:0px;
border:0px;
height:8px;
background-image:url(../imagenes/bottom_login.jpg);
background-repeat:no-repeat;
background-position:right;
width:100%;
}
Como podran ver, me he hartado de colocar margin 0px y paddinng 0px, pero sigue igual en IE.
Podran notar que cada div tiene un tamaño especifico en pixeles de altura, esto es exactamente el tamaño de la imagen que contiene.
Muchas Gracias de antemano y espero puedan ayudarme