[CSS] Positioning + uitrekken

[Verwijderd]

Sinds kort maak ik mijn sites niet meer met tables maar met CSS positioning, simpelweg omdat dit veel minder tijd in beslag neemt en beter te positioneren is.

Wat ik alleen nog niet begrijp is hoe je met dit principe iets kan mee laten rekken, het probleem wat ik nu bijvoorbeeld heb is dat ik langs de linker kant van mijn site een lijn van 1 pixel heb lopen, nu wil ik dat deze wel meerekt met de content, als er bijv. 10 nieuwsartikels op de voorpagina staan dan is de pagina 1000 pixels in height maar de zwarte balk rekt niet mee. Met tables zou ik dit hebben gedaan met height="100%".

Iemand enig idee en/of artikels over dit probleem ?

[David]

Een leuke manier om dit op te lossen is gebruik maken van een achtergrondplaatje van 1 pixel breed en die alleen verticaal te laten repeaten (background-repeat: repeat-y).

Alistapart heeft hier een goed artikel over: http://www.alistapart.com/articles/fauxcolumns/

[Verwijderd]

Bedankt voor de tip Dimension, ik ga het artikel even doorlezen.

[BtM909]

Verwijderd schreef op 29 juni 2004 @ 15:49:
Bedankt voor de tip Dimension, ik ga het artikel even doorlezen.

Maar wat voor constructie gebruik je nu, want als ik je TS doorlees, dan zou je ook de linkerborder van een div kunnen 'misbruiken'.

[Verwijderd]

BtM909 schreef op 29 juni 2004 @ 15:52:
[...]

Maar wat voor constructie gebruik je nu, want als ik je TS doorlees, dan zou je ook de linkerborder van een div kunnen 'misbruiken'.

Wat ik nu doe is een lege div gebruiken en daar de border van gebruiken, dus:

code:

#blackLine 
    {
        border:             1px solid #000000;
        height:         auto;
        position:           absolute;
        right:          50px;
        top:            0px;        
    }

Maar dat werkt dus niet, ik kan wel height op 800 zetten of iets dergelijks maar dat werkt niet met dynamische pagina's/content.

[Verwijderd]

Je hoeft toch niet een aparte div te maken? Je kan gewoon de border van de DIV met je content gebruiken:

Cascading Stylesheet:

div#content {
  border-left: 1px solid #000;

[Verwijderd]

Ik heb nu een plaatje van 800 pixels groot gemaakt en als background geplaatst, zie hier: http://www.carforums.nl/nieuw/html/index.html .

Alleen is het nu niet 800 groot vanaf de rechterkant maar 920 pixels

Dit is overigens het design wat ik in CSS probeer om te zetten: http://www.carforums.nl/nieuw/design.gif

[Verwijderd]

Verwijderd schreef op 29 juni 2004 @ 16:19:
Je hoeft toch niet een aparte div te maken? Je kan gewoon de border van de DIV met je content gebruiken:

Cascading Stylesheet:

div#content {
  border-left: 1px solid #000;

Ja zou idd ook kunnen, ik ben niet zo'n CSS-guru dus daar had ik niet aan gedacht. Bedankt voor de tip.

[Verwijderd]

Nog een laatste vraag, als ik in CSS twee exact dezelfde plaatjes bijv. ergens wil plaatsen maar op verschillende plekken, bestaat hier iets voor (overerving of iets dergelijks ?) of moet ik dan twee divs maken + twee verschillende css definities ?

[BtM909]

Verwijderd schreef op 29 juni 2004 @ 16:54:
Nog een laatste vraag, als ik in CSS twee exact dezelfde plaatjes bijv. ergens wil plaatsen maar op verschillende plekken, bestaat hier iets voor (overerving of iets dergelijks ?) of moet ik dan twee divs maken + twee verschillende css definities ?

Als de divs voor de rest hetzelfde zijn, kan je toch twee div's maken die verwijzen naar 1 en dezelfde class?

[Verwijderd]

BtM909 schreef op 29 juni 2004 @ 17:00:
[...]

Als de divs voor de rest hetzelfde zijn, kan je toch twee div's maken die verwijzen naar 1 en dezelfde class?

Het probleem is dan dat de position niet goed is, als ik twee dezelfde klasses gebruik dan is de top-property hetzelfde. Mijn vraag is dus meer of ik een nieuwe klasse kan maken en van die andere klasse kan overerven en de top-property overrulen.

[Verwijderd]

Verwijderd schreef op 29 juni 2004 @ 17:10:
Het probleem is dan dat de position niet goed is, als ik twee dezelfde klasses gebruik dan is de top-property hetzelfde. Mijn vraag is dus meer of ik een nieuwe klasse kan maken en van die andere klasse kan overerven en de top-property overrulen.

ja dat kan je kan meerder classes hangen aan een object

code:

[img]"bla.jpg"[/img]

waarbij foo en bar allebei een aparte class zijn.

[Verwijderd]

Super, thanks !

[Verwijderd]

En vergeet het ALT attribuut niet. (Verplicht.)