Warstwa z-index:2; nie ładuję się do końca

Warstwa z-index:2; nie ładuję się do końca - Wersja do druku

+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: Warstwa z-index:2; nie ładuję się do końca (/thread-warstwa-z-index-2-nie-laduje-sie-do-konca)

Warstwa z-index:2; nie ładuję się do końca - PDI - 26-04-2009

Witam serdecznie!

Mam drobny kłopot z CSS. Potrzebuję tak skonfigurować tło na warstwie z-index:2; aby pokrywało 100% strony. Jednak coś jest nie tak i warstwa ta nie działa do końca. Jeżeli macie jakieś rozwiązanie to będę bardzo wdzięczny.
Z góry dziękuję za odpowiedź i poradę dotyczącą dostosowania tego CSSa do IE.

Dane do strony:
http://www.nlp.ayz.pl/nowa/
http://www.nlp.ayz.pl/nowa/css/template_css.css

Pozdrawiam i życzę dobrej nocy,

Kamil

RE: Warstwa z-index:2; nie ładuję się do końca - Labsta.com - 26-04-2009

Co do IE to spróbuj mojego ulubionego triku. Daj w sekcji head

Kod:
<!--[if lt IE 8]>

<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script>

<![endif]-->

Dużo pomaga, ale nie jest lekiem na całe zło...

Co do problemu z warstwami, to na moje oko nienajlepiej jest pocięty layout. Raczej ciężko to opisać w kilku słowach, bo zbyt wiele rzeczy bym zmienił. Osobiście z-indexy uważam za mało eleganckie rozwiązanie.
Jeśli o tym samym tle myślimy to się nie rozciąga bo ma:

Kod:
height:324px;

a dodatkowo box z treścią nie znajduje się wewnątrz tego, który ma rozciągać. No lepiej tego nie opisze.

W uproszczeniu struktura tej strony mogłaby wyglądać tak:

Kod:
body

--kontener

---top

---menu

---treść

----lewa

----prawa

---stopka

Pozdrawiam

RE: Warstwa z-index:2; nie ładuję się do końca - PDI - 27-04-2009

Dzięki za wszystkie informację. Zainspirowałeś mnie. Wrzuciłem to problematyczne tło na oddzielny z-index i jest okej. Dziękuję. Ale pojawił się kolejny kłopot, przy zmianie ilości tekstu, przy wysokość height:100% dla warstwy div#tlo powoduję wysuniecie się tego tła z dołu strony. Dzieję się tak dlatego, że zastosowałem margines top. Jednak jak z niego zrezygnuję to tło nadal jest za krótkie.

Jak dobrać margines top i wysokość, aby we wszystkich przeglądarkach i przy różnych ilościach tekstu na stronie cała strona wyświetlała się poprawnie.
W tej chwili strona działa poprawnie w Opera 9.6, Firefox 3.0.9, Safari 3.2.
Ale w przeglądarce Opera 9.5 już tło nieznacznie się wysuwa.

Dziękuję za informację.

Pozdrawiam,

Kamil

RE: Warstwa z-index:2; nie ładuję się do końca - Labsta.com - 27-04-2009

Ta wysokość div#tlo to 100% czegoś, prawdopodobnie elementu nadrzednego (rodzica).

Z tą konstrukcją będą różne problemy. Nadal obstawałbym przy strukturze, którą pokazałem poprzednio.

Mówiąc dość obrazowo o wysokości div-ów, można by powiedzieć, że div to balon który coś otacza i tylko jeśli włożysz jeden balon w drugi i nadmuchasz ten wewnętrzny to zewnętrzny się rociągnie.

Kod:
<div id="tlo"> 

  <div id="tresc">

       Powietrze :)

  </div>

</div>

W tym przykładzie tlo to balon zewnętrzny, a treść wewnętrzny. Często dodatkowo dla elementu wew. dodaje się w CSS(jesli są float'y i/lub nie rociąga rodzica):

Kod:
overflow: hidden;

Walcz dalej, będę tu wpadać zobaczyć jak idzie.
Pozdrawiam.

P.S. Zmień

Kod:
<link rel="stylesheet" href="css/template_css.css" type="text/css" charset="utf-8" />

na:

Kod:
<link rel="stylesheet" href="css/template_css.css" type="text/css" />

Aha i w FF3 też jest źle to tło.