Problemer med CSS-layout

[Loomy]

Jeg tenkte jeg skulle droppe tables på en side jeg holder på med, og hittil er jeg positivt overrasket. Det virker rimelig enkelt, men litt småproblemer blir det jo alltid. I dette tilfellet er det en stakkars 2px padding som føkker opp alt.

Ta en titt her: http://home.no.net/epleweb/v4/

Hvis dere ser det samme som meg ligger #content under #left. Den skal egentlig ligge til høyre for den. Og det gjør den kun når paddingen i #content er 0px

 

0px duger ikke, jeg må ha minst 2. Noen tips?

 

Btw, CSS-filen min hvis det hjelper:

body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}
#frame {
width:750px;
margin-right:auto;
margin-left:auto;
margin-top:15px;
padding:0px;
text-align:left;
}

#left {
width:135px;
padding:0px;
float:left;
background:#CCCCCC;
}

#content {
width:615px;
padding:2px;
float:left;
background:#FFFF00;
}

#header {
width:750px;
height:100px;
background:#fff000;
}

 

 

EDIT: Bruker IE6 her. Skulle ikke forundre meg om den var helt fin i Opera og Mozilla

Endret 15. januar 2004 av Loomy

[haugsand]

Ha en padding på 0, og ta istedet margin på de elementene som er inne <div>, som innholdet er i.

[pekle]

Grunnen til at det ikkje funkar er at paddingen blir lagt til på alle sider, altså blir #left+#content 754px, medan #frame er berre 750px, altså blir #content flytta ned.

 

Altså: gjer #frame 754, eller #content 611 eller som satyrium seier, bruk margin.

[Loomy]

Hurray! Trodde jeg hadde testet metoden som pekle nevnte, men jeg tenkte ikke på at det var padding på både venstre og høyre side

 

Anyway, det fungerte fint nå. Spanks for svarene.