Faux column

Hey,

Daar ben ik weer met een nieuwe tutorial. Dit keer gaat het over Faux column. Nu denk je vast, wat is Faux column?

Met Faux column kan je meerdere kolommen even groot maken. Bijvoorbeeld bij een forum, dan heb je een leden info en een bericht div. Maar als je geen faux column gebruikt dan rekt je berichten div niet mee met de leden info.

Voorbeeld (Dit gebeurt er wanneer je geen faux column gebruikt:

Dit staat dan niet echt mooi. Hieronder zie je hoe het met faux column er uit ziet.
Dit loopt dus lekker uit met de ledeninfo. Maar hoe doen we dat nou?

We knippen gewoon simpel een stuk van de leden info en de berichtendiv. (Dit moet wel als afbeelding).

Daarna zet je dit in je CSS:

#berichtcontainer { width: Breedte van afbeeldingpx; background: url(afbeelding); overflow: hidden; }

En dan gebruik je dit in je html

<div id="berichtcontainer">
     <div id="ledeninfo"></div>
     <div id="bericht"></div>
</div>

Hopen dat jullie er wat van hebben geleerd, vragen stellen mag altijd
Gegroet,
Shahiem

GROOTE van afbeelding kan beter
BREEDTE van afbeelding
Verder wel handig
Ik had hier al eerder van gehoord maar kon geen goeie TUTs vinden

Dit is erg handig !

Nielsie schreef:

GROOTE van afbeelding kan beter
BREEDTE van afbeelding
Verder wel handig
Ik had hier al eerder van gehoord maar kon geen goeie TUTs vinden

Dit is erg handig !

Dankje

Maar het plaatje moet toch even breed zijn als de ledeninfo div?

Nielsie schreef:

Maar het plaatje moet toch even breed zijn als de ledeninfo div?

nee, je afbeelding moet de breedte hebben van ledeninfo+bericht.

@shahiem: Ik zou alleen aanraden om berichtcontainer nog overflow:hidden; mee te geven. En repeat-y is dan onnodig.
En ik zou dan ook uitleggen dat je ledeninfo + bericht een float: left moet meegeven anders komen die 2 divs nog onder elkaar te staan

Is goed, bedankt voor de tips