errori nel css

[Alpha_Php]

ciao, ormai è da un pò che ci sbatto la testa, sto creando un sito che vorrei venisse come la foto in allegato, ma vedo tutto bene su IE a 1280 di risoluzione, già a 1024 l'impaginazione va a farsi benedire.

so che ci sono dei problemi nel css, ma non riesco a trovarli, vi posto il css:

html,body{margin:0; height: 100%;}

body{
	background: url(img/sfondo.jpg) repeat-x;
	background-color:#c9c9c9;
	font-family: Verdana;
    font-size: 80%;   /*dimensionamento percentuale del font */
	color:#000000;
    /*text-align: center;   /*centra in IE 5.x */
    }

	
div#alone{
	position: absolute;
	margin: 0 auto;
	width:100%;
	height:20%;
	left:0;
	}
	
div#credit{
	position: absolute;
	width:100%;
	height:101px;
	background:url(img/credit.jpg) no-repeat center;
	/*top: 620px;*/
	bottom: -56px;
	left:1px;
	}

div#pulsanti{
	position: absolute;
	width:100%;
	height:61px;
	padding-top: 16%;
	left:0;
	}
	
div#credit_txt{
	position: relative;
	width:100%;
	height:101px;
	bottom:0;
	text-align:center;
	}

div#foglie{
	position: relative;
	width:306px;
	height:355px;
	bottom:0px;
	left:0;
	}
	
div#container{
	position: absolute;
	width:100%;
	height:100%;
	/*text-align: center;*/
	margin-top:0px;
	border:#FFFF99;
	border:double;
    }

div#content{
	position: absolute;
	width:100%;
	text-align: center;
	top:0;
	right:0;
	border:#FF0099;
	border:double;
	}

div#pagina_sfondo{
	position: absolute;
    width: 100%;
	/*height:30%;*/
	/*margin: 0 auto;*/
	left:0;
	text-align:center;
	top:18%;
	border:#000099;
	border:double;
    }
		
div#pagina{
	position: relative;
   	width: 873px;
	height:30%;
	text-align:center;
	top:30%;
	border:#000099;
	border:double;
	overflow:auto;
	margin: 30% auto;
    }
	
div#logo{
	position: absolute;
	float:left;
	left:0;
	/*background: url(img/logo.png);*/
	padding-top: 0; /*l' altezza dell' header*/
	/*left:0;*/
    /*width: 436px;
	height:304px;*/
	width:34.5%;
	height:15%;
	/*text-align:justify;*/
    }

.tab{
	margin: 0 auto;
    }