sto creando una pagina con layout gestito via CSS, formata da header, menu sinistro, main.
All'interno del main c'è un altro DIV contenente un'immagine.
Su IE6, se restringo la finestra oltre un certo limite, mi espande in altezza il DIV che contiene l'immagine, spostandomela allineata in basso, per cui mi ritrovo un spazio vuoto tra il titolo e l'immagine.
La cosa non si verifica in firefox.
C'è qualche hack che devo utilizzare?
Grazie,
Rw
- Codice: Seleziona tutto
<html>
<head>
<title>TITOLO</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="stile.css" type="text/css">
</head>
<body bgcolor="000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="header">
<h1>TITOLO</h1>
</div>
<div id="main">
<div id="menu">
<ul>
<li class="menu_lev1"><a href="#">HOME</a></li><li class="menu_lev1"><a href="#">Uno</a></li><li class="menu_lev1"><a href="#">Due</a></li><li class="menu_lev1"><a href="#">Tre</a></li>
</ul>
</div>
<div id="content">
<div id="fascia"><img src="ni.jpg" width="700" height="173" border="0"></div>
</div>
</div>
</body>
</html>
stile.css
- Codice: Seleziona tutto
BODY {margin: 0; padding: 0; }
#header {margin: 0; padding: 0; border: 1px solid Navy; height: 68px; top: 0; background-color: #009; }
#header H1 {margin: 25px 0 0 250px; color: White; padding: 0;}
#main {margin: 0;}
#menu {margin: 0; width: 199px; float: left; background-color: #EB3;}
#menu ul { list-style-type: none; margin: 0; padding: 0;}
#menu ul li { font-family: Verdana; padding: 0; margin: 0; text-indent: 5px;}
#menu ul li a {text-decoration: none; display: block; padding: 3px; margin: 0;
border-top: 1px solid #eb0; border-bottom: 1px solid #b70; font-weight: bold; color: Navy;}
#menu ul li a:visited { text-decoration: none;}
#menu ul li a:hover { text-decoration: none; background-color: #FC0; color: red;}
#menu ul li a:active { text-decoration: none;}
.menu_lev1 { font-weight: bold; }
#content {margin: 0 0 0 214px; padding: 5px; border-top: 1px solid white;
text-align: center; color: white;}
#fascia {border-width: 2px 1px; border-color: white; border-style: solid;
margin: 0 0 10px 0; height: 173px;