ciao,
sto realizzando una pagina con table-less layout ma riscontro due problemi che non riesco a venirne capo.
1- perchè il label (di colore azzurro) è al top del box verde con IE7 mentre non con Firefox?
2- perchè il contenuto giallo è staccato dal footer con IE7 e non on Firefox?
(sotto riportato il codice e css relativo)
thanks in advance
Sevenumber
*******************************************
HTML
*******************************************
<!DOCTYPE html
PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="Untitled-2.css" media="screen" />
<title>Associato 2</title>
<meta name="generator" content="TYPO3 4.1 CMS" />
</head>
<body>
<div id="main-box">
<!-- INIZIO: Header -->
<div id="header-box"><!--###header-box### begin -->
<div id="header">HEADER</div>
<!--###header-box### end --></div>
<!-- FINE: Header -->
<hr />
<!-- INIZIO: Colonna Sinistra -->
<div id="left-box"><div class="menu-level1-no item-21">menu</div></div>
<!-- FINE: Colonna Sinistra -->
<!-- INIZIO: Colonna Destra -->
<div id="content-box">
<div class="tx-gdmesercenti-pi1">
<dl class="tx-gdmesercenti-pi1-listrow">
<h1 class="tx-gdmesercenti-pi1-listrowField-title">label</h1><dt class="tx-gdmesercenti-pi1-listrowField-indirizzo">xxx</dt>
</dl>
</div>
</div>
<!-- FINE: Colonna Destra -->
<hr />
<!-- INIZIO: Footer -->
<div id="bottom-box"> <!--###bottom-box### begin -->
FOOTER
<!--###bottom-box### ends --></div>
<!-- FINE: Footer -->
</div>
</body>
</html>
*******************************************
CSS
*******************************************
/* CSS Document */
body {
text-align: center; /*centra in IE 5.x */
}
/* GENERAL fonts */
P, OL, UL, DIV, H1, H2 {
font-family: verdana, arial;
font-size: 12px;
}
hr {
display:none
}
/* contenitore globale */
#main-box {
width/**/: 990px;
text-align: left;
margin: 0 auto;
padding: 0;
}
/* header */
#header-box {
background-color:#3399CC;
padding: 0;
text-align: center;
}
/* colonna sinistra */
#left-box {
float: left;
width/**/: 200px; /* Dimensioni per Explorer 5.x */
width: 200px!important; /* Dimensioni per browser standard compliant */
vertical-align: top;
background-color:#00CC99;
}
/* colonna destra */
#content-box {
float: right;
width/**/: 790px; /* Dimensioni per Explorer 5.x */
width: 790px!important; /* Dimensioni per browser standard compliant */
background-color: #FFCC33;
vertical-align: top;
}
/* footer */
#bottom-box {
clear: both;
padding: 0;
background-color:#00CC33;
text-align: center;
}
/* left-box */
/* left-menu */
DIV.menu-level1-no {
font-size: 12px;
padding-top: 30px;
padding-bottom: 0;
padding-right: 12px;
text-align: right;
height: 30px!important; /* Dimensioni per browser standard compliant */
height/**/: 60px; /* Dimensioni per Explorer 5.x */
}
/* contenuto destra */
/* CONTENT-BOX */
DIV.tx-gdmesercenti-pi1 {
float: left;
width/**/: 180px; /* Dimensioni per Explorer 5.x */
width: 180px!important; /* Dimensioni per browser standard compliant */
background-color: #009900;
}
dl.tx-gdmesercenti-pi1-listrow {
font-size: 10px;
}
h1.tx-gdmesercenti-pi1-listrowField-title {
width/**/: 180px; /* Dimensioni per Explorer 5.x */
width: 180px!important; /* Dimensioni per browser standard compliant */
color: #FFF;
text-align: right;
font-size: 14px;
font-weight: normal;
height/**/: 18px; /* Dimensioni per Explorer 5.x */
height: 13px!important; /* Dimensioni per browser standard compliant */
border-bottom: 1px solid #FFF;
padding-bottom: 4px;
margin: 0 0 4px 0;
background-color: #0099FF;
}
dt.tx-gdmesercenti-pi1-listrowField-indirizzo {
padding: 0 0 0 26px;
height/**/: 18px; /* Dimensioni per Explorer 5.x */
height: 18px!important; /* Dimensioni per browser standard compliant */
font-weight: bold;
}
sto realizzando una pagina con table-less layout ma riscontro due problemi che non riesco a venirne capo.
1- perchè il label (di colore azzurro) è al top del box verde con IE7 mentre non con Firefox?
2- perchè il contenuto giallo è staccato dal footer con IE7 e non on Firefox?
(sotto riportato il codice e css relativo)
thanks in advance
Sevenumber
*******************************************
HTML
*******************************************
<!DOCTYPE html
PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="Untitled-2.css" media="screen" />
<title>Associato 2</title>
<meta name="generator" content="TYPO3 4.1 CMS" />
</head>
<body>
<div id="main-box">
<!-- INIZIO: Header -->
<div id="header-box"><!--###header-box### begin -->
<div id="header">HEADER</div>
<!--###header-box### end --></div>
<!-- FINE: Header -->
<hr />
<!-- INIZIO: Colonna Sinistra -->
<div id="left-box"><div class="menu-level1-no item-21">menu</div></div>
<!-- FINE: Colonna Sinistra -->
<!-- INIZIO: Colonna Destra -->
<div id="content-box">
<div class="tx-gdmesercenti-pi1">
<dl class="tx-gdmesercenti-pi1-listrow">
<h1 class="tx-gdmesercenti-pi1-listrowField-title">label</h1><dt class="tx-gdmesercenti-pi1-listrowField-indirizzo">xxx</dt>
</dl>
</div>
</div>
<!-- FINE: Colonna Destra -->
<hr />
<!-- INIZIO: Footer -->
<div id="bottom-box"> <!--###bottom-box### begin -->
FOOTER
<!--###bottom-box### ends --></div>
<!-- FINE: Footer -->
</div>
</body>
</html>
*******************************************
CSS
*******************************************
/* CSS Document */
body {
text-align: center; /*centra in IE 5.x */
}
/* GENERAL fonts */
P, OL, UL, DIV, H1, H2 {
font-family: verdana, arial;
font-size: 12px;
}
hr {
display:none
}
/* contenitore globale */
#main-box {
width/**/: 990px;
text-align: left;
margin: 0 auto;
padding: 0;
}
/* header */
#header-box {
background-color:#3399CC;
padding: 0;
text-align: center;
}
/* colonna sinistra */
#left-box {
float: left;
width/**/: 200px; /* Dimensioni per Explorer 5.x */
width: 200px!important; /* Dimensioni per browser standard compliant */
vertical-align: top;
background-color:#00CC99;
}
/* colonna destra */
#content-box {
float: right;
width/**/: 790px; /* Dimensioni per Explorer 5.x */
width: 790px!important; /* Dimensioni per browser standard compliant */
background-color: #FFCC33;
vertical-align: top;
}
/* footer */
#bottom-box {
clear: both;
padding: 0;
background-color:#00CC33;
text-align: center;
}
/* left-box */
/* left-menu */
DIV.menu-level1-no {
font-size: 12px;
padding-top: 30px;
padding-bottom: 0;
padding-right: 12px;
text-align: right;
height: 30px!important; /* Dimensioni per browser standard compliant */
height/**/: 60px; /* Dimensioni per Explorer 5.x */
}
/* contenuto destra */
/* CONTENT-BOX */
DIV.tx-gdmesercenti-pi1 {
float: left;
width/**/: 180px; /* Dimensioni per Explorer 5.x */
width: 180px!important; /* Dimensioni per browser standard compliant */
background-color: #009900;
}
dl.tx-gdmesercenti-pi1-listrow {
font-size: 10px;
}
h1.tx-gdmesercenti-pi1-listrowField-title {
width/**/: 180px; /* Dimensioni per Explorer 5.x */
width: 180px!important; /* Dimensioni per browser standard compliant */
color: #FFF;
text-align: right;
font-size: 14px;
font-weight: normal;
height/**/: 18px; /* Dimensioni per Explorer 5.x */
height: 13px!important; /* Dimensioni per browser standard compliant */
border-bottom: 1px solid #FFF;
padding-bottom: 4px;
margin: 0 0 4px 0;
background-color: #0099FF;
}
dt.tx-gdmesercenti-pi1-listrowField-indirizzo {
padding: 0 0 0 26px;
height/**/: 18px; /* Dimensioni per Explorer 5.x */
height: 18px!important; /* Dimensioni per browser standard compliant */
font-weight: bold;
}
