IE no respeta bordes en DIV

Nemutagk · #1 (**permalink**) 30/03/2006, 13:42

Bueno, mi problema es que IE no me respeta los bordes de los div que utilizo, ne firefox, opera y netscape funciona perfecto, para que me entiendan les pongo un ejemplo

como deveria de verse:
________________
| este es un div |
| este es otro div |

y asi es como se ve en ie
________________
| este es un div |
| este es otro div |

como se podran dar cuenta el borde superior del segundo div ie se lo come, no lo muestra, no se porque pasa esto, aqui les dejo el codigo que utilizo

Código:

body,td,th {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #000000;
    width: 800px;
    margin: auto;
    background-color: #FFFFFF;
}
body {
    margin-top: 5px;
    background-color: #CCCCCC;
}
a:link {
    color: #0000FF;
    text-decoration: none;
    background-color: #FFFFFF;
}
a:visited {
    text-decoration: none;
    color: #0066FF;
    background-color: #FFFFFF;
}
a:hover {
    text-decoration: underline;
    color: #0000FF;
    background-color: #FFFFFF;
}
a:active {
    text-decoration: none;
    color: #0000FF;
    background-color: #FFFFFF;
}
#banner {
    text-align: center;
    background-color: #FFFFFF;
    color: #000000;
}
#menuhorizontal {
    text-align: right;
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
    border-top-color: #000000;
    border-bottom-color: #000000;
    background-color: #FFFFFF;
    color: #000000;
}
#piepagina {
    text-align: center;
    clear: both;
    background-color: #FFFFFF;
    color: #000000;
    border: 1px solid #000000;
    float: none;
}
#divprincipal {
    background-color: #FFFFFF;
    color: #000000;
}

#menuvertical {
    width: 180px;
    float: left;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #000000;
    background-color: #FFFFFF;
    color: #000000;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #000000;
}
#cuerpo {
    width: 617px;
    text-indent: 5px;
    float: right;
    background-color: #FFFFFF;
    color: #000000;
}

y este es el html

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<link href="css/base.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="divprincipal"><div id="banner"><img src="imagenes/Image3_1x1.jpg" width="260" height="37" alt="IOM Evolution" /><img src="imagenes/Image3_1x2.jpg" width="260" height="37" alt="IOM Evolution" /><img src="imagenes/Image3_1x3.jpg" width="260" height="37" alt="IOM Evolution" /><img src="imagenes/Image3_2x1.jpg" width="260" height="38" alt="IOM Evolution" /><img src="imagenes/Image3_2x2.jpg" width="260" height="38" alt="IOM Evolution" /><img src="imagenes/Image3_2x3.jpg" width="260" height="38" alt="IOM Evolution" /><img src="imagenes/Image3_3x1.jpg" width="260" height="38" alt="IOM Evolution" /><img src="imagenes/Image3_3x2.jpg" width="260" height="38" alt="IOM Evolution" /><img src="imagenes/Image3_3x3.jpg" width="260" height="38" alt="IOM Evolution" /></div>
<div id="menuhorizontal">Colocar aquí el contenido de la nueva etiqueta Div</div>
<div id="menuvertical">Colocar aquí el contenido para  id "menuvertical"</div>
<div id="cuerpo">Colocar aquí el contenido para  id "cuerpo"</div>
<div id="piepagina">Colocar aquí el contenido para  id "piepagina"</div>
</div>
</body>
</html>

el problema pasa unicamente con los div que tienen el ID #menuhorizontal, #menuvertical y #piepagina

de antemano gracias

Nemutagk · #2 (**permalink**) 30/03/2006, 14:52

bueno, he resuelto el problema, y es metiendo un div basio con un style="clear:both" pero... ahora he encontrado otro problema mas, y es que el div menuhorizontal desaparece, no se muestra en ie, el espacio que ocupa el div aparece en blanco, eh aqui el css del div

Código:

#menuhorizontal {
    text-align: right;
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
    border-top-color: #000000;
    border-bottom-color: #000000;
    background-color: #FFFFFF;
    color: #000000;
}

y el codigo html es

Código HTML:

<div id="menuhorizontal">Colocar aquí el contenido de la nueva etiqueta Div</div>

solo porque mucha gente sigue utilizando IE si no, me olvidaba definitivamente de este explorador