ugrás a tartalomhoz

lehetséges a szülő div 100%-os kitöltése?

unregistered · 2012. Már. 20. (K), 13.53
Sziasztok!

Lehetséges egy div kitöltése (JS nélkül, csak HTML és CSS segítségével) úgy hogy a benne található div (child) öröklje annak méreteit absolute position alapján?
  1. <div id="parent">  
  2.     <div id="child">  
  3.     </div>  
  4. </div>  
A lényege ennek az hogy eltakarja a parent tartalmát a child, de sejthető legyen alatta a tartalom. (a parent tartalmaz gombokat képeket, szövegeket, a child 50%-osan átlátszó fekete)

(természetesen a height, width 100% nem jó mert átméretezem a böngészőt és máris kilóg, az inherit meg nem örökíti mivel a parent-nak nincs fix magassága)

Előre is köszönöm!
‹ Div drag stop és restart mail küldés megoldása feliratkozás után ›
 ■
1

#parent {

tiku I tikaszvince · 2012. Már. 20. (K), 14.28
  1. #parent {  
  2.   position:relative; /* vagy absolute */  
  3.   
  4.   /* szélesség, magasság ízlés szerint, akár el is hagyható */  
  5.   width: 200px; height: 200px;  
  6. }  
  7.   
  8. #child {  
  9.   position: absolute;  
  10.   top:0; left:0; /* a #parent bal felső sarkába tesszük */  
  11.   
  12.   /* örökölje a szülő magaságát és szélességét: */  
  13.   width:100%; height:100%;  
  14.   
  15.   /* és a takarás */  
  16.   background:#000;  
  17.   opacity:.5;  
  18. }  
Az átméretezésre azért lehet érdemes lenne egy kis JavaScriptet írni, ami "utána igazítja" a #child méreteit
3

kulcs a szülő postion

unregistered · 2012. Már. 20. (K), 15.24
Jah tehát akkor a szülő postition megadása a kulcsrész...

Köszönöm a fejtágítást! :)
2

Nyújtás

bamegakapa · 2012. Már. 20. (K), 15.16
A position: absolute és mind a négy irány megadása segítségével ki tudod nyújtani a belső divet:
  1. #parent { position: relative; }  
  2. #child { position: absolute; top: 0; bottom: 0; left: 0; right: 0; }  
Itt meg is lehet nézni

A belső div követni fogja a szülő méretét átméretezésnél is, nincs szükség javascriptre.
4

mégjobb

unregistered · 2012. Már. 20. (K), 15.29
Akkor ez jobb is mint az előző, bár nem látok különbséget megjelenítésben így elsőre... talán más böngészőkben.