rozszeżenie diva w dół Opcje

[kari]

Mam taki kod:

[HTML] pobierz, plaintext 
<style type="text/css">
#box_pod_menu { position: absolute;
                top:      355px;
                left:     205px;
                width:    124px;
                height:   100px;
                background-image: url(../grafika_strony/box_pod_menu.png);
                background-repeat: repeat-y;
                z-index:  4; }
</style>
 
<div id="box_pod_menu">
</div>
[HTML] pobierz, plaintext 

Box jest zawieszony w pewnej stałej odległości od górnej krawędzi okna, ale nie potrafię go zmusić, aby rozszerzał się w dół, do samego końca okna, nie zależnie jaka jest ustawiona rozdzielczość??

[Zajec]

bottom: 0?

[kari]

bottom: 0; niestety nie działa

[Cysiaczek]

Możesz spróbować

Kod

height: 100%;

[Zajec]

A mi działa.

Pokaż swój test-case dla niedziałającego bottom.

[-SaraniS-]

Witam
Niestety, mnie również, mimo wielu kombinacji, nie udało się (tylko pod IE) uzyskać efektu. W innych przeglądarkach to działa prawidłowo, jednak IE nic sobie z tego ustawienia nie robi... Jakiś hack?

[E -dd]

Może

Kod

height: 100pc;
margin-bottom: 0;

[envp]

Kurde, przeciez to jest znany odwieczny problem, wiążący się min. z footerem na divach. Oj Św. Mikołaj chyba przyniesie wygrawerowany adres google'a

[gekon]

Wysokość zdeklarowana na 100% rozszerza element do maksymalnej wysokości rodzica. W XHTMLu (wysyłanym jako aplikacja xmla - czyli tylko w Przeglądarkach) jest to html->body->div, więc jeżeli html i body nie będą miały wysokości okna (dla html "rodzicem" jest okno przeglądarki), to element potomny nie będzie miał wysokości okna. W X/HTMLu wysyłanym jako text/html też nie zaszkodzi ustawić wysokości dla html i body. Tyle teoria, w praktyce nie sprawdzałem.

[-SaraniS-]

Tylko, ze u mnie div z trescia ma dynamiczna wysokosc, wiec co za tym idzie, cala rodzina w strone body tez musi miec dynamiczna wysokosc
Poza tym, czytalem gdzies, ze akurat co do procentowej wysokosci, to jest to namieszane, i do jej obliczenia brana jest szerokosc rodzica, a nie wysokosc
A co do footera, nawet w stronie o dynamicznej wysokosci, to poradzilem sobie bardzo prosto Otoz wystarczy jego rodzicowi (dynamicznemu) ustawic position relative oraz padding-bottom na wysokosc footera, a sam footer dac position: absolute i bottom: 0

[gekon]

To nie wiem w końcu czy chcesz żeby ten div był na całą wysokość strony, czy miał dynamiczną.

[-SaraniS-]

Całą wysokość swojego rodzica, ale ten rodzic ma wysokość dynamiczną!
Po prostu - jest div z treścią - której może być dowolna ilość (w tym konkretnym przypadku jest to jedno "duże" zdjęcie, o stałej szerokości, ale różnej wysokości, oraz jakiś tekst pod nim), a z boku ma być pasek z miniaturami innych zdjęć dla tego artykułu - i ten pasek ma zajmować całą wysokość swego rodzica, niezależnie, jak ten rodzic jest rozciągnięty! Oczywiście pasek ma overflow: auto lub overflow: scroll, jeszcze nie wiem, co będzie lepsze w tym wypadku.
position: absolute; top: 0; bottom: 0; sprawdza się dla Opery i FF (w FF co innego się sypie ale nad tym pracuję), natomiast IE wymiaruje pasek wg ilości zawartych w nim miniatur (jak dla overflow: visible) i wywala je wszystkie na ekran
Jakby co, podaje linka do tego co kombinuje: http://saranis.interka.pl/akimo_new/main.php?d=2

[EDIT]
Okazuje się, że wystarczyło wstawić rodzicom 2 poziomy w górę height: 100% i w IE już to działa tak, jak chciałem, i jak w innych przeglądarkach
Problem solved
[/EDIT]

Ten post edytował -SaraniS- 20.12.2006, 12:31:28

[garguss]

Przeczytałem uważnie wszystkie posty z tego tematu i o ile dobrze wszystko zrozumiałem,
to taki kod powinien zadziałać w oczekiwany przeze mnie sposób, tz.

DIV z zielonym tłem powinien się rozciągnąć, aż do końca niebieskiej warstwy, jednak tego nie robi...

----------------------------------------------------------------------
EDIT

Oczywiście chodzi mi o wysokość tej warstwy a nie szerokość...

END
----------------------------------------------------------------------
Sprawdzałem zarówno pod FF jak i IE

[HTML] pobierz, plaintext 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
</head>
<body>
<div id="all" style="width:800px; height: 100%; background-color: #FF0000; margin: 0px;">
    <div id="lewa" style="float: left; width: 197px; height: 100%; background-color: #00FF00; top: 0px; bottom: 0px; overflow: auto;">
    <br />
    </div>
    <div id="srodek" style=" width: 600px; height: 100%; background-color: #0000FF;">
        <br />
        <br />
        <br />
        <br />
    </div>
</div>
</body>
</html>
[HTML] pobierz, plaintext 

moje pytanie brzmi dlaczego ?

P.S.
Proszę o wyrozumiałość ponieważ dopiero zaczynam swoją przygodę z CSS-em

Ten post edytował garguss 20.12.2006, 17:15:31

[-SaraniS-]

garguss
Z moich potyczek wiem, że element, który chcesz rozciągnąć, nie może pływać, musi być spozycjonowany absolutnie (czy pozycjonowanie relatywne zadziała - nie wiem). Zresztą w przypadku przedstawionego laya nie jest trudna jego przeróbka na absolut

[HTML] pobierz, plaintext 
<div style="position: relative; margin: 0 auto; width: 100%; height: 100%;">
<div style="position: absolute; top: 0; left: 0; bottom: 0; width: 25%; height: 100%;">
I ten div bedzie wlasnie rozciagniety :)
</div>
<div style="float: right; width: 74%;">
Lewy div powinien rozciagac sie wg wysokosci tego diva
</div>
</div>
[HTML] pobierz, plaintext 

O ile nie strzeliłem gdzieś byka - pisałem z głowy, mniej więcej takie układy sam stosuję Poprzez łączenie pozycjonowania absolutnego oraz pływania (ale nie w jednym divie!), można rozwiązać problem stopki
Pozdrawiam

[garguss]

Dzięki wielkie za pomoc, tak jak już wcześniej napisałem dopiero zaczynam swoją przygodę z CSS i bardzo się cieszę, że są ludzie,
którzy odpowiadają nawet na takie pytania jak to moje.

Jeszcze raz dziękuje -SaraniS-