3 colonne con margini

[brucomela]

Ciao a tutti, devo realizzare un layout a 3 colonne con larghezza fissa (200 - 560 - 200) contenute in uno spazio di 1000 px.

Le colonne sono distanziate tra loro e dai bordi del contenitore di 10 px.

Quindi schema:

10 px - colonna1 - 10 px - colonna2 - 10 px - colonna3 - 10px

Io ho pensato a un wrapper di 1000px e a 3 colonne float left. Le prime due con margin-left di 10px la 3a con margin right di 10 px.

Tutto ok con Firefox, ma su IE 6 ho problemi (so che raddoppia il margine se ha float e margin dalla stessa parte, ma anche usando display:inline sulla prima colonna non risolvo!).

Qualcuno ha idee? Ho persino pensato di renderlo un layout a 6 colonne, senza margini: forse funzionerebbe ma mi pare un'assurdità!!

per favore, un'idea migliore!

grazie

[oronze]

e se inverti il margin? metti alla 2 e 3 margin right e alla 1 il left....succede uguale? diversamente io procederei con quelli absolute

[brucomela]

ciao oronze, si succede uguale, tanto che devo ridurre di qualche pixel i margini in modo che IE non faccia andare la 3a colonna sotto la seconda...su FF questo comporta una imperfetta centratura.

Mi consigli absolute quindi...io però avrei anche esigenza di mantenere il background uniforme (facendo allungare il wrapper che le contiene quanto la colonna più lunga) se le metto absolute il wrapper dev'essere absolute anch'esso?

Ci posso provare ma se ti vengono idee float mi interessano...mi pare assurdo non si possa fare!

[oronze]

non saprei proprio...dovrei fare delle prove ma non ne ho tempo

[brucomela]

io anche banalmente ho fatto un layout così (lo scrivo, magari c'è qualche imprecisione):

#contenitore{width:1000px; float:left;}
#wrapper{width:980px; float:left; margin-left:auto; margin-left:10px;}
#col1{width:200px; float:left; margin-right:10px;}
#col2{width:560px; float:left; margin-right:10px;}
#col3{width:200px; float:left;}

tutto a posto con FF, IE6 sembra allungare oltremodo la prima colonna, e di conseguenza la 3a va sotto

[brucomela]

risolto, il codice è corretto, ma c'era un div che era più largo, causa immagine contenuta.
grazie!