[html/css] - padding + width

[Verwijderd]

olla,

ik loop tegen het volgende punt aan:

ik wil tekst uitlijnen in een element (bijv. op 20px van rechts in een element van 140px).

bij mijn weten heb ik dan:

Cascading Stylesheet:

#element { width:120px; padding-left:20px; }

Echter met het gebruik van een background-image gaat het fout voor IE 5.0x
De afbeelding wordt aan de rechterzijde van het element met de lengte van de padding-left afgekapt.


Bij hogere versies van IE en FF gebeurt dit niet.

Ik heb ook al een bredere afbeelding voor de background-image gebruikt maar dat werkt ook niet!
Heeft iemand een tip?? Of gewoon 1 backgroundcolor met daarover een plaatje die links is uitgelijnd?

thanks

[crisp]

Lees je eens in over de verschillen tussen boxmodel in moderne browsers en zwaar antieke browsers zoals IE5 en/of IE6 in quirksmode.

Oplossing voor dit soort problemen: een aparte stylesheet gebruiken voor IE < 6 of zoveel mogelijk proberen om dit soort problemen heen te werken door geen width/height samen met padding en borders voor hetzelfde element te gebruiken.

[Victor]

In IE 6 kun je nog door middel van het specificeren van de juiste DOCTYPE overschakelen naar de "strict mode" waardoor het W3C boxmodel wordt gebruikt (waarbij padding dus bij de breedte wordt opgeteld). IE 5.x ondersteund dit nog niet, en zal dus aparte dimensies nodig hebben om alles er nog netjes uit te laten zien. Met conditional comments kun je deze browser een eigen stylesheet geven:

HTML:

<!--[if IE 5]>
    <link rel="stylesheet" href="ie5x.css" type="text/css" />
<![endif]-->