Jak zrobić auto wysokość div w ktorym są inne div-y?

Dla specjalistów Webmastering
#1

Mam coś takiego:

strona

[/code] css

[code]#tresc { position: absolute; float:left; width: 650px; height: auto; margin-left: 230px; margin-top: 70px; margin-bottom: 180px; padding-bottom: 10px; background-color: brown; } #uzywane { position: absolute; float:left; width: 300px; height: auto; margin-left: 10px; margin-top: 70px; margin-bottom: 180px; padding-bottom: 10px; background-color: yellow; } #wolne { position: absolute; float:left; width: 300px; height: auto; margin-left: 340px; margin-top: 70px; margin-bottom: 180px; padding-bottom: 10px; background-color: yellow; }

Jak zrobić zeby

div id=tresc

zwiększał się (chodzi o wysokość) gdy divy które są w nim będą większe i by wychodziły poza ten div.

Jak zrobić żeby ten div zwiększał się razem z innymi divami??

#2

Spróbuj zamiast height: auto; użyj min-height:, np. min-height:20px;

Dzięki temu, blok będzie powiększał się wraz z ilością treści.

#3

To nic nie daje teraz div id=tresc ma wysokość 20px.

To działa tylko wtedy gdy w tym divie jest tekst a jak jest inny div to niestety już nie.

#4

Wywal position:absolute, dla wszystkiego.

#5 
#tresc

        {

        float:left;

        width: 650px;   

        height: auto;

        margin-left: 230px;

        margin-top: 70px;

        margin-bottom: 180px;

        padding-bottom: 10px;

        background-color: brown;

        }

        #uzywane

        {

        float:left;

        width: 300px;   

        height:auto;

        margin-left: 10px;

        margin-top: 70px;

        margin-bottom: 180px;

        padding-bottom: 10px;

        background-color: yellow;

        }

        #wolne

        {

        float:left;

        width: 300px;   

        height: auto;

        margin-left: 340px;

        margin-top: 70px;

        margin-bottom: 180px;

        padding-bottom: 10px;

        background-color: yellow;

        }

pozycjonujesz float left,absolute nie potrzebne.Dajesz height:auto do zewnętrznego div-a.

#6

height:auto to zbędna linijka -> wartość tomyślna, height:100% << w wypadku gradienta (bo tło się nie rozszerza), a ta w ogóle to nie jest potrzebne.

A ty swoim postem nic nie wziosłeś, tylko przeczytałeś mojego i naniosłeś go na kod autora tematu …

#7

Dobra działa.

Tylko co robi linia “float:left;”???

Jeśli jest w div id=wolne to sypie mi wygląd strony a jeśli go usunę to jest dobrze.

#8

float <- przyleganie

Musisz mieć po prostu przyleganie po lewej. Usuwając id tracisz styl dla tego diva. Daj normalne rozmiary to będzie działać bez problemów.

Ogólnie:

-div na całość (treść) > divy w środku, więc width tych obu musi być mniejsze niż ten na zewnątrz. Margin (margines) zwiększa szerokość diva (więc musisz go doliczyć)

#tresc

    {

      float:left;

      width: 650px;   

      background-color: brown;

    }

    #uzywane

    {

      float:left;

      width: 300px;   

      background-color: yellow;

    }

    #wolne

    {

      float:left;

      width: 300px;   

      background-color: yellow;

    }

To powinno działać. A twój ekpert od kopiowania pomylił wartości :stuck_out_tongue:

Btw jak chcesz wyśrodkować korzystaj z margin: 0 auto, dla diva w środku (wtedy ten w środku, oraz ten w którym jest ten w środku muszą mieć szerokość na sztywno)

#9

A jak nie dam float:left to div id=tresc nie zwiększy się jak będzie duży div id=wolne tak??

A jak div id= uzywane się zwiększy to i div id=tresc się zwiększy tak??

#10

Sam rozmiar divów nijak ma się do float:left. Z float left twoje divy wyglądają tak:

cebce0c95e43.gif

Czyli oba divy (ich szerokość) nie może być większa niż szerokość w tym, w którym są.

Jeśli wywalisz te float, div po prostu będzie pod spodem. A że nie masz wysokości to po prostu nic się nie stanie (bo szerokości poszczególnych divów są wtedy liczone, a nie szerokość obu na raz)

A co do zwiększanie się:

Twoje divy poszerzają się w dół wraz z zawartością (bo masz szerokość ustawioną a wysokość nie), więc tak czy siak będą się rozszerzać ze względu na zawartość.