Witam,

Zmagam się z mały problemikiem i dlatego piszę do Was o poradę.
Założenia strony
1. nagłówek ( 100% ) czyli na całą stronę razem z menu
2. środek będzie podzielony na dwie części jedno menu a drugie to treści
3. stopka ( 100% ) strony

Teraz mój problem
Wariant 1

[HTML] pobierz, plaintext 
<div id="naglowka>
   < div id="menu">
   </div>
</div>
 
<div id="srodek">
   <div id="strona_lewa">
   </div>
   < div id="strona_prawa">
   </div>
</div>
 
<div id="stopka">
</div>
[HTML] pobierz, plaintext 

Wariant 2 ( czy zamknąć to wszystko w jednym wielkim pudle div

[HTML] pobierz, plaintext 
<div id="wielki_box">
<div id="naglowka>
   < div id="menu">
   </div>
</div>
 
<div id="srodek">
   <div id="strona_lewa">
   </div>
   < div id="strona_prawa">
   </div>
</div>
 
<div id="stopka">
</div>
 
</div><!-- koniec wielkiego box -->
[HTML] pobierz, plaintext 

Chodzi mi o stronę żeby dobrze wyglądała w małych i dużych rozdzielczościach ( wiadomo nie przewidzę telewizorów 36 cali ) u użytkowników, oraz na różnych przeglądarkach.
Pomóżcie podjąć decyzję zanim się narobię Wy jako fachowcy

ja zamykam w divie
pozniej gdybym chcial np. dac reklame na gorze to wszystko mi sie ladnie przesunie, czy cos

ale wszystko w jednym divie czyli taki wariant 2 u mnie tak ?
Czy jakaś inna kombinacja ?

robie div#body, ktoremu ustalam szerokosc(szerokosc calej strony), wysrodkowuje go, czy cos i buduje w nim
ale z css mam do czynienia od niedawna, takze moze lepiej niech ktos jeszcze sie wypowie

Najczęściej robi się to w tzw. kontenerze ustawiasz sobie div'a "container", któremu określasz szerokość i pozycję i dajesz w niego całą resztę jak coś niejasne napisz dam przykład

Czyli to u mnie drugi wariant tylko u mnie nazywa się to wielki_box,
a w nim dopiero reszta stronki. Głównie chodzi mi o to ,żeby nie ważne przy jakiej rozdzielczości nagłówek i stopka był od na całą szerokość strony.
Rozumiem, że w moim div "wielki_box" mogę dać width 100% tak. Jak byś był miły i pokazał przykład to by było super. Nie musi być gotowiec tylko zarys

Jeśli dobrze odczytuję myśli kolegów to mają oni ciut inne wyobrażenie tego.
Mają duży kontener zawierający części header, body i footer, który jest ustawiany z określoną szerokością na sztywno (zapewne 960px) i wyśrodkowany z użyciem margin: 0 auto. To sprawia, że layout się nie rozjeżdża na szerokościach wyższych. Mogą też mieć kombinację trzech sekcji jako osobne i tylko body byłaby tak marginowana jak wspomniałem. Z width: 100% są problemy jeśli dobrze nie przemyślisz layoutu, bo przy dużych rozdzielczościach strona będzie wyglądać koszmarnie. Chodzi między innymi o tła pod div-ami czy wszelkie użycie pływających elementów, które tekst będzie raz w pełni opływał na niższych, ale na wysokich mogą być problemy ze "schodkami" gdy elementy mogą się wzajemnie opływać i rozstrzelą Ci układ. Posłanie z floatem jakiegoś elementu może wystąpić po tekście, który nie doszedł "do końca wysokości" poprzednio opływanego i utworzysz piramidę. Dlatego stosuje się raczej "static layouts", bo są znacznie bardziej przewidywalne, choć kosztem problemów z miejscem na stronie (za duża szerokość - suwaki w poziomie, za mała - pustka po obu stronach). Poczytaj ciut o "fluid layouts" lub "fluid width layouts" to może nasunie Ci to jakieś pomysły jak rozwiązać problemy z tego typu rozwiązaniami.

No to wymyśliłem tak, co Wy na to.
W przeglądarkach IE 7, 8, Opera 10, FF 3.5.6, Safari, SeaMonkey 2.0.1 wygląda identycznie.
Na rozdzielczościach 800x600 pojawiają się suwaczki ( nagłówek jest krótszy i stopka prawy pasek wystaje poza nie )), 1024x768 dobrze wygląda, 1440x900 też jest super.
Jak macie inne rozdzielczości to chętnie zobaczę screen jeśli podeślecie piotr.redel[ET]gmail.com

Zobaczcie czy to będzie ok czy coś jednak pozmieniać i dopracować. Będę wdzięczny za uwagi

LINK do stronki