div dinamico

[ste902]

Ciao a tutti, devo fare una pagina che si adatti a tutte le risoluzioni. Sono a questo punto: http://jack902.site90.com/home.php Come vedrete il div del menu laterale è molto grande perchè se lo faccio più piccolo, cambiando risoluzione mi sballa. Sapete dirmi se sbaglio qualcosa? grazie. Questo è il css:

body {
	font-family:Arial, Helvetica, sans-serif;
	margin:10px;
}

h1{
	
	color:red;
	text-align: center;
	padding:0;
	margin-bottom:0;
}

div.main {
	border: 1px solid gray; 
}

div.header {
	padding: 0.5em;
	border-bottom: 1px solid gray;
}

div.menu {
	float: left;
	width: 25%;
	padding-left: 2%;
	border-right: 1px solid gray;
}

div.content {
	margin-left: 27%;
	padding: 10px;
	border-left: 1px solid gray;
}

div.footer {
	clear: both; /*important*/
	padding: 0.5em;
	border-top: 1px solid gray;
}

ul{
	list-style-type:square;
	line-height: 2em;
}

p.header{
	text-align: right;
	margin-right:5%;
}

[Nobody33]

Sapete dirmi se sbaglio qualcosa?

Il layout di per se va benissimo.
Ma se vuoi un sito che si adatta a tutte le risoluzioni, è meglio usare le
@media di css3

Esempio:

@media (max-width: 979px) {

stile tuo per risoluzione massima 979px
}

@media (max-width: 600px) {
stile tuo per risoluzione massima 600px
}

Puoi mettere anche min-width, min-width and max-width.

Cerca in rete, troverai molto materiale a riguardo.