Problema con CSS con 3 colonne

**erlupacchiotto** · 01-12-2004, 11:21

Vi riporto il codice della pagina e del CSS sperando nel vs. aiuto.

Il problema e' che su Mozilla Firefox e Internet Explorer ho 2 diversi comportamenti dei css

grazie
ciao

HTML

codice:

<body alink="#000000" class="Pagina">



<div id="footer">
           testata testatatestatatestata testata testata testata testata testata testata testata 
</div>
<div id="pageFrame">



	<div id="leftColNew" title="ColonnaSinistra">
                colonna sinistra
                colonna sinistra
                colonna sinistra
	</div>




	<div id="contentColNew" title="ColCentrale">
            ciaociaociaociaociaociao ciaociaociaociaociaociao ciaociao  ciaociao  ciao ciao ciaociao ciao ciaociao ciao ciao ciao ciaociao ciao
	</div>




		<div id="rightColNew" title="ColonnaDestra">
                colonna destra
                colonna destra
                colonna destra
                colonna destra
		</div>
</div>		
	<div id="footer">
			&copy;FOOTER   FOOTER FOOTER FOOTER FOOTER  FOOTER  FOOTER  FOOTER FOOTER 
	</div>
	</body>
</html>

CSS

codice:

#leftColNew {
		margin-right: 50%; 
		float: left; 
		width: 13%;}
#rightColNew {	float:right; width: 13%; }
#contentColNew { 
width: auto; 
  }
#innerContentColNew
{width: 50%; 
  margin-left: 10%;
  margin-right: 10%;
  }

**pierofix** · 01-12-2004, 14:55

IE funziona (in modo scorretto

) così:

width: 100px; padding: 10px; --> tutto il div è largo 120px.

Mozilla funziona (correttamente

) così:

width: 100px; padding: 10px; --> tutto il div è largo 100px.

Per ovviare, nel css metti

div {
width: 80px;
padding; 10px;
}
body>div {
width: 100px;
padding; 10px;
}

ovviamente con le proprietà che vuoi tu. Il primo comanda IE, il secondo Mozilla.

**erlupacchiotto** · 01-12-2004, 17:09

pero' scusmai cosi' facendo continua a funzionare ma solo specificando i px, invece a me occorreva farlo in base percentuale
potresti aiutare ?
grazie
ciao

**pierofix** · 01-12-2004, 17:25

Stessa identica cosa.
Ricordati solo che se, per esempio, hai due colonne, una che occupa l'80% e l'altra il restante, la seconda non specificarla 20% ma 19.9%.

**erlupacchiotto** · 01-12-2004, 18:01

Ho inserito sotto tutto il codice html e css insieme
Perche' la colonna di destra mi appare sotto ?
grazie
ciao

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
	<title>PROVA</title>
<style type="text/css">
div, body {
  border: 1px solid #000;
  margin: 0;
  padding: 0;
 }
.footer {clear: both; }
#leftColNew {
		margin-right: 5%; 
        border: 1pt;
		float: left; 
		width: 10%;}
#rightColNew {border: 2pt; margin-left: 650px; width: 20px; }
#contentColNew { 
width: 90%; 
        border: 1pt;
  }
#innerContentColNew
{
        border: 1pt;
  margin-left: 1%;
  margin-right: 1%;
  }
</style>
</head>

<body alink="#000000" class="Pagina">



<div class="footer">
           testata testatatestatatestata testata testata testata testata testata testata testata testata testata testata testata testata testata testata testata testata 
</div>
<div id="pageFrame">



	<div id="leftColNew" title="ColonnaSinistra">
                colonna sinistra
                colonna sinistra
                colonna sinistra
	</div>




<div id="contentColNew" title="ColCentrale">
	<div id="innerContentColNew" title="ColCentrale">
            ciaociaociaociaociaociao ciaociaociaociaociaociao ciaociao  ciaociao  ciao ciao ciaociao ciao ciaociao ciao ciao ciao ciaociao ciao
	</div>
</div>




		<div id="rightColNew" title="ColonnaDestra">
                 destra
                 destra
                a destra
                 destra
		</div>
</div>		
	<div class="footer">
			©FOOTER   FOOTER FOOTER FOOTER FOOTER  FOOTER  FOOTER  FOOTER FOOTER 
	</div>
	</body>
</html>

Discussione: Problema con CSS con 3 colonne

Strumenti discussione

Ricerca discussione

Visualizza

Problema con CSS con 3 colonne

Permessi di invio