[DIV] Layer laten meeverschuiven met bovenliggende layer

[Verwijderd]

Hallo,

Voor ik deze vraag stel heb ik uiteraard de search, google, w3school.com etc al geprobeerd.

Ik zit met het volgende probleem. Ik heb een lay-out gemaakt met layers in dreamweaver. Dit gaat allemaal goed totdat ik onder de layer voor de content een layer wil plaatsen met een image erin om het gewoon netter af te werken.

Ik heb even een situatie gemaakt die hopelijk te begrijpen is:

1. Het eerste voorbeeld laat zien hoe ik de contentlayer (zonder tekst etc) en de image layer heb staan.



2. In het tweede voorbeeld zie je wat ik wil bereiken met beide layers. Je ziet hier dat de content layer in lengte toeneemt en de image layer eronder blijft staan.



3. Maar helaas berusten deze beelden (nog) niet op de werkelijkheid want dit is wat er gebeurd. De content layer overlapt de image layer wat ook normaal is. Maar ik wil dat juist niet hebben.



Hoe kan ik dit voor elkaar krijgen? Is wat ik wil wel eens mogelijk of zijn er meerdere manieren voor? Ik heb overal al gezocht voor dit probleem maar ik kan er maar niet achter komen hoe ik dit kan oplossen.

Ik ben nog beginnend met css. De rest van de lay-out is goed gelukt maar het is net dit laatste onderdeel waar ik niet uitkom.

Weet iemand hier een oplossing voor?

Bij voorbaat dank.

[simon]

je moet ze relative maken, met deze css code: position: relative;

Zou je ook html kunnen laten zien?

[ Voor 23% gewijzigd door simon op 29-10-2004 21:51 ]

[Sendy]

Twee block-level elements komen by default onder elkaar. Je moet dus geen positioning toepassen.

Maar we kunnen niet zien wat je nu doet: kan je misschien een (gestripte) test case in je post hierboven plaatsen?

[Verwijderd]

ok bedankt voor de snelle reactie ik zal een screenshot en de code even neerzetten.

De code is waarschijnlijk wat rommelig omdat dit mn eerste poging is met layers en omdat de pagina anders nogal extreem uitrekt..

code van de contentlayer (layer 2) en image layer (layer 12).

code:

<div id="Layer1" style="position:absolute;
 left:50%; top:96px; width:180px; height:222px; z-index:3; margin-left: -363.5px; visibility: visible;">

  <div id="Layer12" style="position:absolute; width:366px; height:26px; z-index:9; left: 180px; top: 434px;">
[img]"images/banneronder.gif"[/img]</div>

  <div id="Layer2" style="position:absolute; width:366px; height:433px; z-index:10; left: 180px; top: 0px;
 background-color: #EFEDE6; layer-background-color: #EFEDE6;"></div>

screenshot van de 2 layers:



een screenshot van de volledige lay-out is hier te vinden

http://www.nerdwerx.nl/images/nw.JPG

[Verwijderd]

probeer eens gewoon alle style bij Layer12 en Layer2 weg te halen, volgensmij moet dat zelfs werken.

[Verwijderd]

Als ik dat doe gooit ie al mn layers in de war.

Ik zit nu te denken om eerst een nieuw document te maken en gewoon 2 layers te maken en dan te expirimenteren met "position"

Die position absolute zorgde ervoor dat mn layers netjes naast en boven elkaar mooi bleven staan zonder dat ze alle kanten op stonden. Ik denk dat het aan mijn opbouw ligt. of zoiets dergelijks.

Heeft dit toevallig ook iets met "nesten" te maken?

[ Voor 9% gewijzigd door Verwijderd op 29-10-2004 22:38 ]

[Verwijderd]

ik denk dat je het flow model van css nog niet helemaal begrijpt:

http://www.rikkertkoppes....showbook.asp?bookId=9#C28 en
http://www.w3.org/TR/CSS21/visuren.html

[Verwijderd]

Verwijderd schreef op 29 oktober 2004 @ 22:39:
ik denk dat je het flow model van css nog niet helemaal begrijpt:

http://www.rikkertkoppes....showbook.asp?bookId=9#C28 en
http://www.w3.org/TR/CSS21/visuren.html

bedankt! Ik ga dit doornemen mocht iemand nog wat weten dan hoor ik dat graag natuurlijk.

Bedankt jullie hulp.

[Verwijderd]

Ik begin het door te krijgen. Hier kan ik verder mee! bedankt voor alle de hulp!

[Verwijderd]

Normaal gesproken zet je twee divjes gewoon onder elkaar door ze achter elkaar te zetten in het zelfde parent element:

code:

<div id="parent">
  <div id="tekst">
  </div>
  <div id="image">
  </div>
</div>

Dus ik snap niet wat je allemaal moeilijk zit te doen met position, z-index en zo...