Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [css] wysokosc div'a
Forum PHP.pl > Forum > Przedszkole
bmL
Witam,
kolejne głupie pytanko z mojej strony smile.gif
Załóżmy, że mam kod html:
  1. <tr>
  2. <td></td>
  3. <td></td>
  4. <td></td>
  5. </tr>

No i teraz lewa i prawa kolumna zawiera jakieś tło nieważne jakie w zależności od zawartości środkowej kolumny one przyjmują taką samą wysokość jak ta środkowa.
Czy da się uzyskać identyczny efekt stosując kontenery?
Hazel
  1. div { height: 100px }

Ta właściwość przykładowo określa wysokość wszystkich divów na stronie na 100 pikseli.
bmL
Źle mnie zrozumiałeś. Nie mogę określić wysokości tych kontenerów i w tym tkwi problem.
Jeżeli treść środkowego kontenera przekroczy przykładowe 100px to środkowy kontener będzie miał większą wysokość niż te po bokach.
A ja nie jestem w stanie określić wysokości tego kontenera ponieważ jego treść jest generowana dynamicznie załóżmy, że znajdują się tam np newsy.
Próbowałem czegoś takiego:
  1. <div id="all">
  2. <div id="lewa" style="height: 100%"></div>
  3. <div id="srodek"></div>
  4. <div id="prawa" style="height: 100%"></div>
  5. </div>

Ale to daje efekt dopiero wtedy kiedy kreślę wysokość kontenera "all".
Znalazłem trochę inne rozwiązanie ale one wcale nie określa wysokości pobocznych divów właściwie je wyklucza.
Chociaż pytanie jest nadal aktualne jestem ciekaw czy da się jakoś wyrównać poboczne divy do wysokości środkowego?
EDIT:
Problem rozwiązany tongue.gif

index.html
  1. <div id="lewa"></div>
  2. <div id="srodek"></div>
  3. <div id="prawa"></div>

style.css
  1. #lewa, #srodek, #prawa {
  2. display: table-cell;
  3. }


EDIT (znów):
Jednak rozwiązanie to działa tylko pod FF jakieś sugestie?
Kreton
Nie wiem czy dobrze rozumiem. Chodzi ci może o Faux Columns ?
Z technicznego punktu widzenia jest to nie do uzyskania. Z graficznego punktu widzenia jest to do uzyskania.
bmL
To rozwiązanie znalazłem już wcześniej pisząc kilka postów wyżej:
"Znalazłem trochę inne rozwiązanie ale one wcale nie określa wysokości pobocznych divów właściwie je wyklucza."
chodziło mi właśnie o to tongue.gif Szkoda, że wszystko jest tak ograniczone przez ie...

Mam jeszcze jedno pytanko odnośnie css. Mianowicie załóżmy, że mam takie coś:
  1. <div style="width: 100px; display:inline">abc</div>
  2. <div style="width: 100px; display:inline">def</div>

W IE i Opera jest wszystko ok ale w FF i Mozilli ignorowana jest szerokość kontenera...
Zrobiłem to tak, że w zależności wykrytej przeglądarki danym kontenerom przypisany jest atrybut inline albo table-cell.
Ale zastanawiam się czy jest na to jakiś inny sposób.
post
Ja radze sobie z tym w inny sposob.
Tworze nowego diva (id="all") w ktorym zamykam sobie pozostale dwa (menu,content).
Wycinam przez szerokosc calej strony (tj. menu + content) 10px pasek.
Teraz divowi ALL nadaje w stylu css tlo obrazkowe (ten pasek, ktory wycialem)
do tego repeat:y;.
Predator446
Z 2 divami to bez problemu Faux Columns, a gdy miałem wyrównać wysokość 3 divów to już użyłem js i chodzi...
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.