Forum PHP.pl > [HTML][CSS]Jak ustawić inne tło z lewej części strony i inne z prawej?

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [HTML][CSS]Jak ustawić inne tło z lewej części strony i inne z prawej?

kukix

30.03.2009, 11:35:58

Witam.
Mam stronę zbudowaną na div'ach.

Wszystkie elementy znajdują się w dive znajdującym się na środku:

[HTML] pobierz, plaintext 
<div style="width: 999px; margin: 5px auto;">
zawartośc strony
</div>
[HTML] pobierz, plaintext

czy jest jakiś spsoób, żeby ustawić inne tło z lewej strony tego div'a i inne z prawej?

Próbowałem w ten sposób:

[HTML] pobierz, plaintext 
<div style="float: left; background-color: red; width: auto;">TŁO Z PRAWEJ</div>
<div style="float: left; width: 999px; margin: 5px auto;">
zawartośc strony
</div>
<div style="float: left; background-color: yellow; width: auto;">TŁO Z PRAWEJ</div>
[HTML] pobierz, plaintext

Sposób ten jednak nie dizała, ponieważ jest problem z ustawienie mszerokości tych dwóch divów po bokach.

Jest na to jakiśspsoób, czy pozostaje tylko zbudowanie strony na tabelce?

Będe bardzo wdzięczny wszelkie wypowiedzi.

Spawnm

30.03.2009, 11:42:04

zobacz to:
http://matthewjamestaylor.com/blog/equal-h...er-css-no-hacks

hiszpanespaniol

30.03.2009, 21:03:34

nie musisz stosować żadnych sztuczek z wysokościami div'a.
Sposób jest prosty, html daje Ci jeszcze dwa dodatkowe tagi których się nie pozbędziesz, a które możesz wykorzystać. Masz przecież <html> i <body>. htmlowi nie ustawisz szerokości (choć możesz dać mu tło), ale body jak najbardziej możesz. Więc:

1. szerokość i automatyczny margines ustaw dla <body>, a nie dla tego div'a.
2. zdefiniuj lewe tło dla <body>.
3. zdefiniuj prawe tło dla diva (tego najogólniejszego).
ew. 4. poustawiaj wysokość 100% dla <html> i <body> jeżeli chcesz mieć zawsze całe okno przeglądarki wypełnione tłem obustronnym.

Proste i działa

pozbywasz się dwóch div'ów służących tylko jako pojemnik dla tła.

black_alexis

31.03.2009, 09:50:17

mozesz równiez do prawego diva wsadzić:

Kod

float:right;

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.