login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Faux Columns

Offline Sandernerd - 01/06/2008 13:23
Avatar van SandernerdPHP beginner Ik las dit artikel:
http://www.giga...umns-maken/
Is het mogelijk om dit te realiseren, maar dan zonder afbeeldingen meer gewoon puur css?

7 antwoorden

Gesponsorde links
Offline vinTage - 01/06/2008 13:33
Avatar van vinTage Nieuw lid Als dat zou kunnen was er nooit een probleem qua hoogtes etc he, en hoefde ze dit niet te gebruiken/ontwerpen..
Offline Sandernerd - 01/06/2008 13:34
Avatar van Sandernerd PHP beginner In de comments zeggen een paar mensen dat dit kan zonder afbeeldingen, en dat zou ik graag willen weten 
Offline vinTage - 01/06/2008 13:37 (laatste wijziging 01/06/2008 13:41)
Avatar van vinTage Nieuw lid ja, met javascript..maar dan kan je beter een één px hoge img nemen imo..

edit, oh en een linkje uit die comment... (dus toch zonder js )
http://www.alis...ple_3.html
Offline Sandernerd - 01/06/2008 13:50
Avatar van Sandernerd PHP beginner Bedankt 
Offline snxs - 05/05/2011 15:39 (laatste wijziging 05/05/2011 15:43)
Avatar van snxs Nieuw lid Voor mensen die hier ooit nog eens mee zitten:
Dit kan ook zonder afbeeldingen.

Door een ontzettend grote bottom-padding mee te geven, en een zelfde negative bottom-margin tekent de renderer wel de div door, maar wordt er geen box aangemaakt.

Holder div:
Plaatscode: 140999

Column divs:
Plaatscode: 141000

Dit zorgt er voor dat background colors & borders vrolijk door getekend worden tot de onderkant van de holder div. (Waar de renderer tegen de "overflow: hidden;" knalt, en dus niet verder tekent.)

Voordeel:
Dit kun je met "fluid-columns" en "fixed-columns" met een "fluid-holder" doen. Wanneer de "fluid-holder" kleiner wordt, voegen de kolommen zich netjes samen.
Offline Ontani - 05/05/2011 15:43
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
jammer dat het op zo'n "lelijke" manier wel lukt.
Offline snxs - 05/05/2011 15:50
Avatar van snxs Nieuw lid Klopt. Maar het werkt. Cross-browser.

Het gebruik van "display: table;" & "display: table-cell;" zou ook kunnen. Maar dit wordt niet door iedere browser ondersteunt.
Gesponsorde links
Je moet ingelogd zijn om een reactie te kunnen posten.
Actieve forumberichten
© 2002-2019 Sitemasters.be - Regels - Laadtijd: 0.163s