 Czyżby bezsens layoutu na divach...? |
  |
| Czyżby bezsens layoutu na divach...? |
 24.09.2007, 12:51:35
Post
#1
|
|
 Grupa: Przyjaciele php.pl Postów: 1 595 Pomógł: 282 Dołączył: 24.09.2007 Skąd: Reda, Pomorskie. Ostrzeżenie: (0%) 
 |
Witam.
CHCIAŁEM być dobry. Nie chciałem przechodzić na ciemną stronę... Naczytałem się, że layouty oparte o tabelki są BE! Że wolno tylko na divach. Wziąłem się poważnie do roboty, net, tutoriale, przykłady, dziesiątki godzin prób i WIELKIE G.... NIE POTRAFIĘ (albo to po prostu niemożliwe) zbudować na div'ach najprostszego layotu. Trzy panele, ułożone jeden pod drugim. Pierwszy Nagłówek o stałej wysokości na początku treści strony. Druga Treść o zmiennej wyskości, automatycznie dopasowująca się do rozmiarów zawartości, ale jeśli tej treści jest mało, to panel ma ładnie rozciągać się w pionie na CAŁĄ wysokość strony (oczywiści minus wysokość pozostałych paneli). Trzecia Stopka, o stałej wysokości, wyietlana u dołu ekranu (jeśli Treści mało) albo pod Treścią (jeśli jej dużo). W tabelkach wygląda to tak: Kod <html> <head> <title>TEST</title> </head> <body> <table style="height:100%;width:100%"> <tr style="height:30px"><td style="border:1px solid">NAGŁÓWEK</td></tr> <tr><td style="border:1px solid">TREŚĆ</td></tr> <tr style="height:30px"><td style="border:1px solid">STOPKA</td></tr> </table> </body> </html> I działa bez problemu w każdej przeglądarce. Bez hacków, skryptów, php czy innych wspomagaczy.... Odpowiedzcie mi proszę - czy ja jestem debilem - czy też takiego layoutu na divach nie da się zrobić...? Pozdrawiam, Leszek. -------------------- - Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... - |
 |
 
|
|
24.09.2007, 12:58:02
Post
#2
|
|
|
Grupa: Przyjaciele php.pl Postów: 7 494 Pomógł: 302 Dołączył: 31.03.2004 Ostrzeżenie: (0%)
|
Takie coś 
|
|
|
|
|
24.09.2007, 13:06:56
Post
#3
|
|
 Grupa: Zarejestrowani Postów: 2 262 Pomógł: 21 Dołączył: 3.05.2004 Skąd: Sopot, Krakow, W-wa Ostrzeżenie: (0%)
|
A im clear:both nie trzeba dac ?
-------------------- Javascript, Coffeescript, Node.js, Mongo, CouchDb, chmury, workery & inne bajery - zycie jest zbyt krotkie aby miec nudna prace :)
|
|
|
|
|
24.09.2007, 13:13:18
Post
#4
|
|
|
Grupa: Przyjaciele php.pl Postów: 1 595 Pomógł: 282 Dołączył: 24.09.2007 Skąd: Reda, Pomorskie. Ostrzeżenie: (0%)
|
Mike, przyjacielu - albo nie czytałeś mojego posta, albo "zgadujesz" rozwiązanie problemu.
Layout jest ok. ALE NIE ZAJMUJE 100% wysokości w oknie przeglądarki... Pozdrawiam, czekam na dalsze propozycje... -------------------- - Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... - |
|
|
|
|
24.09.2007, 13:29:34
Post
#5
|
|
|
Grupa: Przyjaciele php.pl Postów: 7 494 Pomógł: 302 Dołączył: 31.03.2004 Ostrzeżenie: (0%)
|
Przegapiłem ten niuans.
To co piszesz jest bardzo trudna do osiągnięcia pisząc na blokach. To jeden z niewielu problemów z blokami. Nie można określić swobodnie ich wysokości jeśli rodzic nie me jej również określonej i nie rozciagają się automatycznie tak jakbyśmy czasem chcieli. Konsensusem jest to: |
|
|
|
|
24.09.2007, 14:09:17
Post
#6
|
|
|
Grupa: Przyjaciele php.pl Postów: 1 595 Pomógł: 282 Dołączył: 24.09.2007 Skąd: Reda, Pomorskie. Ostrzeżenie: (0%)
|
Mike, widzisz, ja te wszystkie konsensusy przetrenowałem w ostatnim tygodniu w wielu wariantach. W tej wersji footer przysłania treść przy zniejszaniu okna...
Trochę to wygląda na zawracanie kijem Wisły: zamiast użyć standardu do budowy takiego layautu jaki jest potrzebny, można zrobić tylko taki layout na jaki standard pozwala... Dziwne tylko, że identyczny układ na tabelkach wszystkie przeglądarki interpretują zgodnie z oczekiwaniami... I nie mają problemu z automatycznym wyliczeniem rozmiaru środkowego wiersza... Jestem tydzień w plecy z robotą - -wracam do tabelki - nawet jeśli jest to niewskazane - najważniejsze jest zadowolenie klienta... Pozdrawiam. -------------------- - Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... - |
|
|
|
|
24.09.2007, 17:00:53
Post
#7
|
|
 Grupa: Zarejestrowani Postów: 359 Pomógł: 1 Dołączył: 16.04.2006 Skąd: Łódź Ostrzeżenie: (0%)
|
Daltego layouty na div`ach są tak bardzo cenione przez webmasterów - są trudne do osiągnięcia. Ale oczywiście to co piszesz jest do zrobienia
|
|
|
|
|
24.09.2007, 17:21:41
Post
#8
|
|
|
Grupa: Zarejestrowani Postów: 5 Pomógł: 0 Dołączył: 24.09.2007 Ostrzeżenie: (0%)
|
Cytat(nevt @ 24.09.2007, 15:09:17 )  Mike, widzisz, ja te wszystkie konsensusy przetrenowałem w ostatnim tygodniu w wielu wariantach. W tej wersji footer przysłania treść przy zniejszaniu okna... A nie wystarczy dodać dolny margines do środkowej części? |
|
|
|
|
24.09.2007, 17:47:08
Post
#9
|
|
 Grupa: Zarejestrowani Postów: 1 086 Pomógł: 8 Dołączył: 10.12.2003 Ostrzeżenie: (0%)
|
A nie lepiej po prostu z Google porozmawiać?
"100% height layout" Jeden z pierwszych wyników: http://www.xs4all.nl/~peterned/examples/csslayout1.html |
|
|
|
|
24.09.2007, 22:15:19
Post
#10
|
|
|
Grupa: Przyjaciele php.pl Postów: 1 595 Pomógł: 282 Dołączył: 24.09.2007 Skąd: Reda, Pomorskie. Ostrzeżenie: (0%)
|
Serdeczne dzięki Zajec.
Wygląda na to że działa - skopiuję sobie i pomęczę różne warianty wypełnienia... Szczerze mówiąc, to nie mam pojęcia jak działa - to znaczy jaki mechanizm zmusza środkowy panel do zwiększania wysokości... Widocznie zielony jeszcze jestem jak pietruszka. Ale pytanie zostaje aktualne - po co w moim przypadku divy? Layout prosty jak drut, w tabelce zajmuje 3 linijki kodu (nawet arkusza CSS nie trzeba zakładać - niezbędne style są prościutkie... A ten przykład na divach - tak na oko 2 strony kodu (no można uprościć do 1...) Więc po co? Dla idei? W czym to lepsze? Nikt mnie nie przekona, że słuszne jest korzystanie z trudniejszych i bardziej skomplikowanych narzędzi aby osiągnąć prosty cel. A do tego bajzel z przeglądarkami... Niby mamy standardy, ale każda z wodącej trójcy wyświetla je sobie trochę inaczej. Praktycznie nawet najprostsze stronki muszą stosować hacki, tricki lub skrypty, żeby zapewnić w miarę spójny layout w zaledwie 3 najpopularnieszych przeglądarkach... A z każdej strony słychać, że musimy trzymać się standardów - pytam JAK? Pozdrawiam wszystkich, Leszek. Ten post edytował nevt 24.09.2007, 23:00:18 -------------------- - Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... - |
|
|
|
|
24.09.2007, 22:30:33
Post
#11
|
|
 Grupa: Zarejestrowani Postów: 1 385 Pomógł: 55 Dołączył: 1.03.2005 Skąd: śląsk Ostrzeżenie: (0%)
|
tak tak
jestm tam tajemniczy skrypt ktory odwala cala robote! to google! wielki brat google. oni juz robia tyle rzeczy ze nawet zabrali sie za poprawne wyswietlanie stron uzytkownikow:Dzeby zakonczyc twoje niejasnosci to tutaj jest css odpowiedzialny za ten 'bajer' Kod height:auto !important; /* real browsers */
height:100%; /* IE6: treaded as min-height*/ min-height:100%; /* real browsers */ Ten post edytował AxZx 24.09.2007, 22:32:21 -------------------- aplikacje internetowe | Symfony
|
|
|
|
|
24.09.2007, 23:04:21
Post
#12
|
|
|
Grupa: Przyjaciele php.pl Postów: 1 595 Pomógł: 282 Dołączył: 24.09.2007 Skąd: Reda, Pomorskie. Ostrzeżenie: (0%)
|
Sorka za zamieszanie - dla tych co zdążyli przeczytać....
Skrypt działa (przeglądarki pobierały jakieś śmieci z cashe - stąd początkowe niepowodzenie) - cóż - następne pytanie zadam w przedszkolu PHP żeby się nie wydurniać na poważnym forum. Pozdrawiam. Znam już rozwiązanie -dziekuję wszystkim - temat do zamknięcia. -------------------- - Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... - |
|
|
|
|
30.09.2007, 15:00:28
Post
#13
|
|
|
Grupa: Zarejestrowani Postów: 17 Pomógł: 0 Dołączył: 19.04.2006 Ostrzeżenie: (0%)
|
Jeszcze jedno warto dodać: Jak dodasz do szablonu na tabeli jakikolwiek DOCTYPE to szablon przestanie się rozciągać.
Edit: http://www.wykladowca.cba.pl/czyzby.html <- DTD XHTML 1.0 strict. twój kod +
Nie rozciąga się. Poprawne według walidatora w3c Może po prostu trza sprawdzić czy się potrafi dołączyć DOCTYPE do dokumentu zanim się zakwestjonuje? Edit 2: Powody dla których zaleca się DIVY i CSS są proste: - elastyczność - elastyczność - elastyczność A od czasu IE7 we wszystkich przeglądarkach są malutkie różnice w wyświetlaniu, i osoba, która ma doświadczenie w CSS, napisze arkusz tak, że strona będzie wyglądała tak samo we IE, Operze i FF. (no chyba że mowa o pseudoklasach :before i :after). Więc jak ktoś ma luksus olania użytkowników IE6, to CSS jest najwygodniejsze. Ten post edytował Wykladowca 30.09.2007, 20:43:48 |
|
|
|
|
30.09.2007, 17:25:04
Post
#14
|
|
|
Grupa: Przyjaciele php.pl Postów: 1 595 Pomógł: 282 Dołączył: 24.09.2007 Skąd: Reda, Pomorskie. Ostrzeżenie: (0%)
|
Kłamiesz Wykładowco. Na przyszłość proszę, sprawdź, a potem wystawiaj język...
Tabelka ładnie się rozciąga zarówno w DTD XHTML 1.0 Strict jak i XHTML 1.1... Pozdrawiam. -------------------- - Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... - |
|
|
|
|
30.09.2007, 18:40:13
Post
#15
|
|
 Grupa: Zarejestrowani Postów: 219 Pomógł: 5 Dołączył: 18.07.2006 Skąd: Piekary Śląskie Ostrzeżenie: (0%)
|
Cytat(nevt @ 24.09.2007, 23:15:19 ) Więc po co? Dla idei? W czym to lepsze? Nikt mnie nie przekona, że słuszne jest korzystanie z trudniejszych i bardziej skomplikowanych narzędzi aby osiągnąć prosty cel. Bo nie wszyscy mają to wielkie szczęście bycia osobami dobrze widzącymi. Dlatego W3C wymyśliło sposób tworzenia stron, który pozwala na ich sensowne odzwierciedlanie przez syntezatory mowy. -------------------- CMS dla Twojej firmy
Wojciech Małota |
|
|
|
|
30.09.2007, 21:39:10
Post
#16
|
|
|
Grupa: Przyjaciele php.pl Postów: 1 595 Pomógł: 282 Dołączył: 24.09.2007 Skąd: Reda, Pomorskie. Ostrzeżenie: (0%)
|
Drogi Wykładowco.
Może faktycznie słowo kłamiesz było za mocne - przepraszam, bo widzę że się przejąłeś. Ale dalej nie masz racji. Skoro już jesteś takim perfekcjonistą, to wstaw do swojego testu również style="height:100%" do znaczników <html> i <body> - i będzie się rozciągać aż miło... Nie używaj mojego skrótu w prezentacji problemu do wykazywania swojej wyższości... Wkońcu nie sztuka wkleić 3 stony kodu - tylko komu będzie się to chciało analizować... Co do elastyczności layoutu na div + CSS - zgadzam się, ale niestety tylko TEORETYCZNIE. Dlatego, że specyfikacja CSS2 sobie, a życie (czyt. rendering przeglądarek) sobie - skutek jest taki, że czasami aby uzyskać proste zachowania ZGODNIE ze standardem, i kod przechodzący WALIDACJĘ trzeba się mocno nakombinować. Wg mnie zupełnie niepotrzebie. Jak mi znajdziesz choć jednego klienta, który da mi zlecenie na warunkach: olej IE6/7, olej Operę i inne dziwadła, niech się tylko w starym, dobrym FFoxie ładnie wyświetla to przestanę marudzić... Prawda jest taka, że w chwili obecnej standard CSS2 jest FIKCJĄ, ŻADNA przeglądarka nie implementuje go w 100% idealnie wg specyfikacji. Kierunek zmian jest dobry, ale najwyraźniej potrzeba jeszcze roku , może dwóch, nowej generacji przeglądarek i wtedy będziemy w raju... Zakładając ten temat, chciałem tylko zwrócić uwagę, że w pewnych, specyficznych sytuacjach robienie layoutu "na siłę" na divach ma tyle samo sensu, co wbijanie gwoździa w deskę za pomocą wiertarki. Wiertarka jest niewątpliwie zaawansowanym narzędziem, niezbędnym do połączenia desek wkrętami, ale dla gwoździa lepszy jest dużo prostszy w użyciu i zastosowaniu młotek... Niech każdy uważa co chce, ale nadal nie trafia do mnie że 2 strony kodu są lepsze od 10 linijek kodu - jeżeli generują ten sam wynik... Pozdrawiam, Leszek. -------------------- - Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... - |
|
|
|
|
1.10.2007, 06:46:40
Post
#17
|
|
 Grupa: Zarejestrowani Postów: 1 657 Pomógł: 125 Dołączył: 29.04.2006 Ostrzeżenie: (0%)
|
Ej! Weź pod uwagę, że Opera, czy inne mniej znane przeglądarki takie jak Safari, Konqueror (jak to sie pisze?) są równie ważne co ten twój firefox. Nie chcę tu wykazywać, że moim zdaniem Opera jest lepsza od ff, ale to jest tak samo jak IE vs nowoczesne przeglądarki, tj. to, że FF jest popularniejszy od innych nie oznacza że jest lepszy.... bo nie jest.
Po za tym layout na divach jest sensowny - od strony kodu jest dużo czytelniej (i rzadko kiedy dłużej), a przynajmniej pomagasz oczyścić net z niesemantycznych stron + to co mówił cicik - syntezatory mowy. Wyobrażasz sobie czytanie tabelek? Oooo nie, tylko nie to 
-------------------- |
|
|
|
|
1.10.2007, 07:06:50
Post
#18
|
|
 Grupa: Zarejestrowani Postów: 662 Pomógł: 45 Dołączył: 26.03.2007 Skąd: Warszawa Ostrzeżenie: (0%)
|
@radex_p - Czyli FF czy Opera nie są lepsze od IE ? Hehe
|
|
|
|
|
1.10.2007, 09:03:59
Post
#19
|
|
 Grupa: Zarejestrowani Postów: 1 045 Pomógł: 5 Dołączył: 8.11.2004 Skąd: trójmiasto Ostrzeżenie: (0%)
|
Hm to czemu taki kod nie działczy?
|
|
|
|
|
1.10.2007, 12:44:59
Post
#20
|
|
|
Grupa: Zarejestrowani Postów: 1 385 Pomógł: 55 Dołączył: 1.03.2005 Skąd: śląsk Ostrzeżenie: (0%)
|
bo nie masz nic w divie
-------------------- aplikacje internetowe | Symfony
|
|
|
|
|
|
Wersja Lo-Fi | Aktualny czas: 19.07.2025 - 13:55 |
