Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: układanie div'ow jeden pod drugim
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
kris2
15.09.2007, 11:03:40
Mam problem z układaniem diwów jeden nad drugim.
chciałbym założyc kilka divów pod sobą, np:

[HTML] pobierz, plaintext 
  1. #banner {
  2.  
  3.     position: relative;
  4.  
  5.     z-index: 3;
  6.  
  7.     height: 151px;
  8.  
  9.     width: 1005px;
  10.  
  11.     visibility: visible;
  12.  
  13.     margin:0pt auto;
  14. }
  15. #profile {
  16.  
  17.     position: relative;
  18.  
  19.     z-index: 3;
  20.  
  21.     width: 1005px;
  22.  
  23.     height:1500px;
  24.  
  25.     margin:0pt auto;
  26.  
  27.     visibility: visible;
  28.  
  29. }
  30. #footer {
  31.  
  32.     position: relative;
  33.  
  34.     z-index: 3;
  35.  
  36.     height: 43px;
  37.  
  38.     width: 1005px;
  39.  
  40.     margin:0pt auto;
  41.  
  42.     bottom: 0px;
  43.  
  44.     visibility: visible;
  45.  
  46. }
[HTML] pobierz, plaintext


a w środku:

[HTML] pobierz, plaintext 
  1. #profileTop {
  2.  
  3.     position:absolute;
  4.  
  5.     width:1000px;
  6.  
  7.     height:385px;
  8.  
  9.     z-index:5;
  10.  
  11.     top: 2px;
  12.  
  13.     left: 2px;
  14.  
  15. }
[HTML] pobierz, plaintext


zależność wygląda tak:

[HTML] pobierz, plaintext 
  1. <div id="banner">
  2.     <img src="images/bzium.jpg" width="1005" height="151" />
  3. </div>
  4. <div id="profile">
  5.             <div id="profileTop">
  6.                     Jakaś zawartość
  7.                 </div>
  8.                 ...
  9. </div>
  10. <div class="text_footer" id="footer">
  11. </div>
[HTML] pobierz, plaintext



i problem polega na tym że wszystko się ładnie układa. Ale ja chciałbym nie deklarować wysokości głównych divów aby wysokość wyznaczała się automagicznie.
Jeżeli wyłącze wysokość footer, profile i banner to profile i footer nachodzą na siebie.
Podejrzewam że nie nachodzą na banner bo banner ma wyznczoną wysokość przez obrazek.
Zalezy mi na dynamicznym wyliczaniu wysokości ponieważ zawartość profile będzie generowana z javascriptu.
trucksweb
15.09.2007, 15:38:16
a nie lepiej uzyc float: left ?

po co z-index: 3;? dry.gif
PawelC
24.09.2007, 23:57:16
A nie lepiej jest nieustawiać żadnego float tylko margin:auto i tak wpisać kod:
Cytat
<div class="nazwa 1">
</div>
<div class="nazwa 2">
</div>
<div class="nazwa 3">
</div>

I oczywiście każdy z tych divów musi mieć margin:auto; ja zawsze tak robię jak chcę mieć kilka divów jeden pod drugim i działa bez problemu.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.