Ciao,
sto studiando un po' i fogli di stile grazie ai suggerimenti trovati soprattutto su questo forum.

Vorrei riuscire ad eliminare o cmq ridurre al minimo l'uso delle tabelle per il layout delle pagine web e così sono arrivata a fare quanto sotto riportato, però mi succede che quando vado a ridimensionare la finestra del browser (IE) il div centro si sposta perchè il div right viene spostato sempre + verso sinistra man mano che si ridimensiona la finestra.

Vi chiedo (nella speranza di essere stata chiara a sufficienza nell'esposizione del mio probl): e' normale, tutto questo?
Cosa si potrebbe fare per ovviare ciò?




codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>Prova css</TITLE>
<STYLE TYPE="text/css">
.p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000000;
}
.p a:link {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	color: blue;
	text-decoration: none;
}
.p a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	color: #0066FF;
	background-color: #FFCC00;
	text-decoration: none;
}
.p a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	color: #000000;
	text-decoration: none;
}
.col-sx {
	height: 100%;
	display: block;
	margin: 5px;
	border: 1px solid #0000ff;
	padding: 0;
	visibility: visible;
	float: left;
	width: 200px;
	background-color: #CED8EA;
}
.col-md {
	height: 100%;
	display: block;
	border: 0px;
	visibility: visible;
	float: none;
	margin-top: 0px;
	margin-left: 220px;
	width: 30px;
	background-color: #FFFFFF;
	padding-top: 5px;
}
.col-dx {
	height: 100%;
	display: block;
	margin: 5px;
	border: 1px solid #0000FF;
	padding: 0;
	visibility: visible;
	float: right;
	width: 200px;
	background-color: #EFEFEF;
}
.testa {
	font-family: verdana, arial, times;
	color: navy;
	font-size: 12px;
	height: 5%;
	display: block;
	border: 1px solid #000000;
	padding: 2;
	visibility: visible;
	margin-left: 10px;
	margin-right: 10px;
	width: 100%;
	background-color: #FFFF99;
}
.piede {
	font-family: verdana, arial, times;
	color: navy;
	font-size: 12px;
	height: 5%;
	display: block;
	border: 1px solid #000000;
	padding: 2;
	visibility: visible;
	margin-left: 10px;
	margin-right: 10px;
	/*float: left;*/
	width: 100%;
	background-color: #FFCC99;
}
</STYLE>
</HEAD>

<BODY>
<DIV ID="box"> 
	<DIV ID="testa" CLASS="testa">INIZIO</DIV> 
		<DIV ID="colsx" CLASS="col-sx"> 
			<DIV ID="link1" CLASS="p"> left 1 </DIV> 
			<DIV ID="link2" CLASS="p"> left 2 </DIV> 
			<DIV ID="link3" CLASS="p"> left 3 </DIV> 
			<DIV ID="link4" CLASS="p"> left 4 </DIV> 
		</DIV> 
		<DIV ID="right" CLASS="col-dx">   
			<DIV ID="a" CLASS="p"> right 1 </DIV> 
			<DIV ID="b" CLASS="p"> right 2 </DIV> 
			<DIV ID="c" CLASS="p"> right 3 </DIV> 
			<DIV ID="d" CLASS="p"> right 4 </DIV> 
		</DIV> 
		<DIV ID="centro" CLASS="col-md">   
			<DIV ID="main" CLASS="p"> center 1
 dfaafffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff 
 center 1
 dfaafffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff 
 center 1
 dfaafffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff 
 center 1
 dfaafffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff 
</DIV> 
		</DIV> 
		

	<DIV ID="coda" CLASS="piede">fine</DIV> 
</DIV>
</BODY>
</HTML>

GRAZIE x l'attenzione.

Ciao ciaO

Rosamaria