Buonasera,
Io ho il seguente problema:
praticamente ho una pagina index con tre div centrati solo orizzontalmente e fin quì tutto bene. Ma facendo svariati test ho notato che diminuendo la risoluzione dello schermo il div a destra viene "tagliato" e il suo contenuto sparisce....
Questo è il layout della pagina:

schema1.jpg

e questo è il problema:

SCHEMA4.jpg

Come potete vedere nella seconda immagine, a sinistra, aumentando la risoluzione , i div si centrano perfettamente, a destra, diminuendo la risoluzione, il div "navigation" a sinistra viene tagliato! Di seguito riporto anche il codice css:
---------------------------------------------------------------
html,body{
margin:0;padding:0
}


body{
font: 76% arial,sans-serif;
}


p{
margin:0 10px 10px
}


a{
color: #981793;
}


table.center {
margin:auto;
}


div#header{
height:80px;
line-height:20px;
margin:0;
padding-left:10px;
background-image: url(/img/sfondo-headers2.png');
color: #FFFFFF
}


div#login{
position:absolute;
float:right;
width:386px;
height:80px;
margin-left:200px;
margin-top:-85px;
left:50%;
}


div#content p{
line-height:1.4
}


div#wrapper{
height:100%;
float:center;
width:100%
}


div#content{
position:absolute;
width:675px;
height:550px;
scrollbar: hidden;
left:50%;
margin-left:-337px;
overflow: auto;
}

div#navigation{
position:absolute;
width:337px;
height: 570px;
left:50%;
margin-left:-674px;
overflow: auto;
}
---------------------------------------------------------------
Eliminando le istruzioni "left:50%;" e "margin-left" il problema svanisce, ma ovviamente i div non vengono più centrati.

Quale può essere la soluzione? Help!

Grazie in anticipo

Buona serata :-)