[css] background showed niet

[Verwijderd]

Ghah! Na zoveel malen te hebben gelezen dat je xhtml met css moet gaan gebruiken ben ik me aan gaan wagen. Nou daar gaan we dan, ik stuit gelijk op het probleem achtergrondplaatjes.
Ik wil een plaatje telkens laten herhalen in de x positie. Nou heb ik het volgende gebrouwen.

code:

<div id="container" class="coverage">
    <div id="left" class="left_div">
    </div>
        <div id="midden" class="center_div">
            <img src="images/vraalte_header.jpg" border="0"
alt="image van raalte autos" />
        </div>
    <div id="right" class="right_div">
    </div>
</div>

Met als CSS

code:

body{
    font-family:verdana;
    font-size:10px;
    padding:0px;
}

.coverage{
    text-align : center;
    width:100%;
}

.left_div{
    background-color:#ffffff;
    display:inline;
    width:auto;
}

.center_div{
    background-color:#ffffff;
    display:inline;
    width:750;
}

.right_div{
    background-image:url("images/bg_right.jpg");
    background-repeat: repeat-x;
    display:inline;
    width:auto;
}

De bedoeling is dat de header in het midden komt (dat lukt) en dat aan de rechtkant een klein plaatje telkens herhaalt. Aan de linkerkant moet de achtergrond gewoon wit. Dat lukt ook.
Nou komt dat plaatje wat aan de rechtkant moet er helemaal niet. Alleen als ik wat tekst in de div gooi..
Wat moet ik doen voordat de rechter div zich vult met mijn background-image?

Suggeties?

[ Voor 9% gewijzigd door Verwijderd op 30-03-2004 20:44 ]

[Verwijderd]

Een DIV neemt niet standaard de hoogte aan van je achtergrondplaatje . Valideer je CSS ook even, je bent een aantal essentiele (eenheden) dingen vergeten.

[kleautviool]

Overigens is het overbodig om én een id én een class mee te geven.
Je kunt die class weglaten, en alles in je id zetten.

De punt ( . ) in je stylesheet wordt dan een hekje ( # )

edit:
Tenzij je het natuurlijk meerdere keren wilt gebruiken, dan moet je wel voor een class gaan

[ Voor 22% gewijzigd door kleautviool op 30-03-2004 20:53 ]

[Verwijderd]

Verwijderd schreef op 30 maart 2004 @ 20:49:
Een DIV neemt niet standaard de hoogte aan van je achtergrondplaatje . Valideer je CSS ook even, je bent een aantal essentiele (eenheden) dingen vergeten.

like what?

[Verwijderd]

Valideren . Als je het gewoon even doet zie je het vanzelf (hint: 'width:750;').

[Verwijderd]

Okay dat heb ik aangepast Heb hem door de validator heen gedaan en die zegt nu dat ie goed is.

[crisp]

display: inline en width:xxx gaan bij mij al niet samen; gebruik dan floats
Daarbij vind ik de naamgeving ook niet je-van-het: content en opmaak van elkaar scheiden betekent juist dat je je code ontdoet van alles wat met opmaak te maken heeft; als je dan een class="right_div" in je code gaat zetten dan had je net zo goed meteen de style inline kunnen doen.

[Verwijderd]

moet:

Cascading Stylesheet:

background-image:url("images/bg_right.jpg");

niet dit zijn:

Cascading Stylesheet:

background-image:url(images/bg_right.jpg);

dus zonder dubbele quotes, denk het wel he

edit:
laat maar zie dat de oplossing er al is moet wat beter de andere post lezen weet het

[ Voor 101% gewijzigd door Verwijderd op 31-03-2004 00:50 ]

[Verwijderd]

dus zonder dubbele quotes, denk het wel he

onzin

[Verwijderd]

Verwijderd schreef op 31 maart 2004 @ 07:38:
[...]
onzin

idd dikke bull. vandaar ook die edit he

[ Voor 11% gewijzigd door Verwijderd op 31-03-2004 13:05 ]

[AkaXakA]

Geen onzin, het kán wel, maar werkt niet in alle browsers (volgens mij had IE5/Mac er last van).
Bovendien scheelt het aan bestandsgrote (net als het weglaten van een eenheid als de waarde 0 is, bv).
Daarom is het beter omm geen aanhalingstekens of wat dan ook te gebruiken bij het specificeren van de background.

[Verwijderd]

Dan vraag ik me af wat die "-image" daar doet...

[Verwijderd]

AkaXakA schreef op 31 maart 2004 @ 22:13:
Geen onzin, het kán wel, maar werkt niet in alle browsers (volgens mij had IE5/Mac er last van).
Bovendien scheelt het aan bestandsgrote (net als het weglaten van een eenheid als de waarde 0 is, bv).
Daarom is het beter omm geen aanhalingstekens of wat dan ook te gebruiken bij het specificeren van de background.

makker , had ik dus toch wel een beetje een punt.
Ik vond het al zo vreemd, ik heb het nog nooit gezien en op www.handleidinghtml.nl staat het ook niet. Maar de css komt wel door de validator dus zo erg kan het dus ook weer niet zijn, lijkt mij.

Anne:

idd zo kan het ook:

Cascading Stylesheet:

background: url(watermerk.gif) #FFFF99 no-repeat center;

[ Voor 19% gewijzigd door Verwijderd op 31-03-2004 23:23 ]

[Verwijderd]

code:

background:url(watermerk.gif) #ff9 no-repeat center;

(Ik ben trouwens best benieuwd naar een screenie van MacIE waarin dat fout gaat...)