Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML]Stała pozycja div-a niezależnie od rozdzielczości
Forum PHP.pl > Forum > Przedszkole
Morfi80
Zrobiłem stronę dla auto-szkoły już dość dawno, ale nigdy nie udało mi się rozwiązać jednego problemu. Otóż mam stronę zbudowaną na div-ach, standardowy układ, czyli:
  1. <div id="all">
  2. <div id="header">
  3. </div>
  4. <div id="middle">
  5. </div>
  6. <div id="footer">
  7. </div>
  8. </div>

W stopce mam dwa napisy, które są w porządanej przeze mnie pozycji jedynie wtedy, gdy rozdzielczość monitora ustawiona jest na 1680x1050. Im mniejsza rozdzielczość tym bardziej napisy zjeżdżają się do środka. Aktualnie na stronie pozycje napisów, które są objęte znacznikami <span> ustalają marginesy, ale próbowałem już poleceniem - position:relative, czy fixed; i ciągle to samo. W screenach pokazany jest aktualny kod: html - http://screenshooter.net/7767881/fnlvqof , css - http://screenshooter.net/7767881/wjjdryh . Jak mogę to rozwiązać?
Proszę o pomoc!
Podaję jeszcze link do strony: http://maciekautoszkola.pl/

P.S. Niektóre znaczniki nazwane są trochę nieadekwatnie, ale przecież nie o to chodzi...
prowseed
Skoro korzystasz z wartości procentowych to chyba rozumiesz, że są one zależne od rozdzielczości?
Zrób sobie kontener o szerokości strony, wyśrodkuj go nadając mu styl 'margin: 0 auto;' i dopiero później pozycjonuj napisy w tym kontenerze (w obecnej postaci możesz się ograniczyć do float'ów)
abort
Pisząc "pod swoją rozdzielczość" popełniasz podstawowy błąd - nie wszędzie będzie taka sama rozdzielczość. Większość portali, stron gazet itp pisana jest tak, że w zasadzie (piszę "w zasadzie", bo bywają odstępstwa) wszystko mieści się w kontenerze o szerokości niecałych 1000px (np. 960px, bo się ładnie i bez reszty dzieli przez liczby z przedziału 1-12).

Rady?
1. zrób sobie taki jeden kontener width=960px i w nim sobie skaluj co i jak chcesz.
2. wykorzystaj dwu lub trzykolumnowy layout części głównej (menu i footer możesz rozciągnąć na 100% okna przeglądarki) - ale z zastrzeżeniem, że testujesz to w małych rozdzielczościach ("nawet" 1024px).

Wbrew pozorom takie postawienie sprawy nie jest dziwne, kilka przykładów napotkanych w życiu:
- pracuję na 1440x900, ale szerokość okna przeglądarki mi się zwężyła, bo w XP systemowy pasek (menu start, aplikacje, systray) dałem sobie pionowo po prawej stronie, a po lewej stronie mam zakładki, też pionowy panel - w efekcie szerokość okna przeglądarki jest rzędu 1150px. Odpowiada mi to, bo i tak wszystkie strony, które odwiedzam, wyglądają poprawnie (skoro są testowane w 1024). A ja mam kilka wierszy więcej do czytania maili czy też kodowania.
- są ludzie, którzy mają monitor np. tak jak Ty, czyli 1680x1050, ale... ustawili go sobie pionowo, bo tak im się lepiej pracuje z tekstem - 1050px w 99% wystarcza do komfortowego przeglądania stron, ponieważ są pisane "nawet" dla 1024px. Sam bym tak zrobił w domu, ale mój monitor nie ma pivota (niestety).

No i na koniec bardzo subiektywna rzecz: zbyt dużo tekstu w jednej linii (czyli zbyt długie linie) czyta mi się po prostu niezbyt wygodnie.
Morfi80
Dziękuję za pomoc. Sam zachodzę w głowę dlaczego nie spróbowałem z poleceniem: margin:0 auto;. Przecież już używałem tych wartości w głównym div-ie.

Staram się żeby strona wyglądała tak samo w rozdzielczościach od 1024x780 wzwyż oraz różnych przeglądarkach. Napisałem tylko kiedy stopka zachowuje się poprawnie, czyli w rozdzielczości 1680x1050. Pozostała część strony wygląda już dobrze nawet w innych rozdzielczościach.
binprogrammer
PS. Ta stopka denerwuję tak, że adblockiem ją poszczułem ... strasznie kłuję w oczy
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.
Invision Power Board © 2001-2025 Invision Power Services, Inc.