100% width och padding

[/randis]

Hej! Jag blir tokig!

 

Går det att ha 100% width på ett element kombinerat med en padding utan att elementet blir större än 100%?

 

[Micke_skane]

Nej, detta är något som är lite förvirrande.

Det du sätter som padding får du ta bort ifrån storleken.

Sätter du 5% som padding blir storleken 95%.

Berör både px och % som storlek.

 

Vet inte hur dem tänker "lösa" detta i framtida versioner av css/xhtml.

 

[Anjuna Moon]

Gäller det bara IE så är det deras box-model-bugg du har problem med, där padding och marginaler inte fungerar som de skall om du kör sidan i quirks-mode.

Läs mer här:

http://webdesign.about.com/od/css/a/aaboxmodelhack.htm

 

[/randis]

Jag hittade ett sätt. Det funkar i FF och det var det enda jag var intresserad av i detta läge. Har inte testat något annat, men logiskt så borde det gå

 

#container {

width: 600px;

padding: 0px 5px;

}

#filler {

width: 100%

padding: 0px 5px;

margin-left: -5px;

}

 

<div id="container">

<div id="filler"></div>

</div>

 

Om det funkar i någon annan browser kan ni väl ge mig tusentals poäng?

 

[Micke_skane]

Det är ett sätt om du blandar % med px och det fungerar i IE, FF, Opera.

Bra att du visar ytterliggare lösningar i tråden så att nästa som söker på samma problem får hjälp på vägen