Forum PHP.pl > [xhtml][css] wysokość div'a

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [xhtml][css] wysokość div'a

Gosc_Pawel

16.08.2006, 18:03:59

Witam

Mam taki oto problemik, kombinowałem ale nie udało mi się go rozwiązać. Mam 2 div'y.

[HTML] pobierz, plaintext 
<div style="float:left; width:150px; background-color: red">Pierwszy</div>
<div style="float:left; width:480px; background-color: green">
Drugi<br/><br/><br/><br/><br/><br/>Dol Drugiego</div>
[HTML] pobierz, plaintext

Są one obok siebie i nie wiem jak zrobić, żeby wraz ze zwiększaniem sie któregoś z nich (np przez wpisywanie tekstu - jak w przykładzie), w tym przypadku drugiego, pierwszy 'rozciągał' się na tą samą wysokość. W tym pierwszym chcę umieścić tylko tło, które musi być na całej wysokości drugiego.

Jeżeli to w ogóle możliwe to proszę o pomoc. Z góry dziękuję

Hej

lukir

16.08.2006, 19:45:38

Wsadź te dwa DIV'y do jednego DIV'a, "kontenera":

[HTML] pobierz, plaintext 
<html>
<head>
<title>Auto filling</title>
<style>
.content0
{
 float: left;
 background-color: red;
 height: 20px; /*wysokość "kontenera" nie jest istotna, sprawia tylko, że CONTENT_1 "rozciąga się"*/
}
 
 
 
.content1
{
 float: left;
 width: 150px;
 background-color: red;
 height: 100%;
}
 
 
 
.content2
{
 float: left;
 width: 480px;
 background-color: green;
 height: 100%;
}
</style>
</head>
<body>
<div class="content0">
  <div class="content1"></div>
 
  <div class="content2"><!--tutaj wstaw długi tekst z wieloma tagami <br>--></div>
</div>
</body>
</html>
[HTML] pobierz, plaintext

U mnie takie coś elegancko chodzi

(tzn. na IE i na Operze, Firefox się sypie...)

Denver

16.08.2006, 19:48:39

Polecam artykuł Faux Columns z Alistapart oczywiście

Gosc_Pawel

17.08.2006, 08:58:07

Hej

Obydwie propozycje polegają na tym samym, czyli na umieszczeniu tych div'ów w kontenetrze z tym, że pierwsza z założenia jest zła bo nie działa pod FF

- no może po drobnych poprawkach. Jednak nie o to mi chodziło. Z tego co kombinowałem dalej dochodzę do wniosku, że jednak inaczej niż wg propozycji nie da się tego zrobić (?).

Pozdrawiam i dziękuję

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.