Mam stronę, która jest w wyśrodkowanym divie. Zarówno header jak i footer tej strony jest wypełniony wzorkiem. Teraz chcę, żeby na górze i na samym dole biegły paski na całą szerokość ekranu (niezależnie od rozdzielczości) również wypełnione tym wzorkiem. Jak to uzyskać?
Poniżej przedstawiam efekt jaki chciałbym uzyskać:
Problem może być w tym, aby wzorek z paska komponował się równo z wzorkiem w środku strony.
Zacząłbym od wyodrębnienia powtarzalnego elementu tła z którego można w nieskończoność budować pasek tła. Następnie zrobiłbym tabelkę z trzema kolumnami w której środkowa ma określony rozmiar, ale taki aby powtarzalne elementy mieściły się w całości np 4 x element powtarzalny. Następnie w lewej kolumnie dałbym background: repeat-x z wyrównaniem do prawej, a w prawej kolumnie dałbym również background:repeat-x z tym że z wyrównaniem do lewej.
Niestety, stronę chcę oprzeć na divach, tabele to przestarzała metoda. Obrazek tła oczywiście ma wyodrębniony.
poza tym w Twoim sposobie wzorkiem wypełniłbym całą lewą i prawą stronę, a ja chcę tylko paski na górze i na dole.
opakuj wszystko w diva i w tym opakowywującym ustaw background-image
Tak jak w przypadku tabelki wypełnienie diva tłem da mi wypełniony cały obszar po lewej i prawej, a ja chcę tylko paski (centralna część ma być pusta).
Tabelka jest metodą jak każda inna :) Przestarzała będzie jak Walidatory to uznają za błąd.
Zrób oddzielną tabelkę "header" i "footer" a pomiedzy nimi daj diva z treścią :)
void-tec napisał(a)
opakuj wszystko w diva i w tym opakowywującym ustaw background-image
A jakie dać szerokości divowm lewa i prawa, żeby paski były rozciągnięte na całą szerokość?
@Buka77:
Z obrazka wynika, że po bokach od treści pole ze wzorkiem ma na górze strony mniejszą, a na dole większą wysokość niż pole ze wzorkiem w treści. Tak jest w rzeczywistym layoucie, czy może tam jest to wyrównane?
Layout ździebko upierdliwy i pewnie nie obędzie się bez brzydkiego lub przynajmniej brzydkawego kodu znaczników, skażonego pewną ilością elementów służących wyłącznie prezentacji.
Ma to działać w IE6, tak w ogóle?
Jeśli nie i jeśli paski ze wzorkiem u góry i na dole mają stałą, znaną wysokość, to możesz zastosować pozycjonowanie absolutne.
@leadersmind:
Tabelka nie jest metodą jak każda inna. Gdy walidator uzna coś za błąd, to jest to... błędem, a niekoniecznie czymś przestarzałym. HTML starszy niż 4.01 jest obecnie przestarzały. W zasadzie to nawet doctype Transitional można uznać za przestarzały.
Walidator W3C jest bardzo daleki od doskonałości. Nie sprawdza nawet całej składni, a co dopiero sensu strony. Zadaniem kodu znaczników jest oznaczenie struktury dokumentu. Walidator tego nie sprawdza, mimo że W3C silnie zaleca pewne rzeczy i odradza inne, definiując poprawne użycie strukturalnych elementów HTML-a.
Tabele służą do reprezentacji danych tabelarycznych. Użycie ich do layoutu przeczy zasadzie rozdzielenia warstw.
Nie wolno ściemniać, że wszystko jest z takim czymś OK, bo się waliduje. Świadczy to o niezrozumieniu samego HTML-a i/lub działania walidatora.
Gdy trzeba, to trzeba zastosować nieeleganckie rozwiązania. Czasem inaczej się po prostu nie da, a czasem rozwiązanie eleganckie jest zbyt skomplikowane i nieopłacalne (nie zawsze tworzy się kod najwyższej możliwej jakości mimo kłamstw jakie ludzie wypisują w działach "Misja i wizja naszej firmy"; nie zawsze klient potrzebuje najwyższej jakości za wszelką cenę).
W każdym razie nie ma co ściemniać, że wszystko jest z nieeleganckimi rozwiązaniami w porządku i że są one jak każde inne. Chyba że reszta Twojego kodu też jest nieelegancka ;).
leadersmind napisał(a)
Zrób oddzielną tabelkę "header" i "footer" a pomiedzy nimi daj diva z treścią :)
Dzięki, nie pomyślałem o tym. Zrobiłem tak jak mówisz (tyle, że na divach) i działa świetnie.
A generalnie zgadzam się z tym, co napisał bswierczynski. Wiadomo, że w 100% poprawny kod czasami jest dla kodonanistów i trzeba iść na kompromisy, ale ogólnie lepiej się stosować do zaleceń W3C, a oni zalecają stosowanie divów do struktury strony.
bswierczynski napisał(a)
@Buka77:
Z obrazka wynika, że po bokach od treści pole ze wzorkiem ma na górze strony mniejszą, a na dole większą wysokość niż pole ze wzorkiem w treści. Tak jest w rzeczywistym layoucie, czy może tam jest to wyrównane?Layout ździebko upierdliwy i pewnie nie obędzie się bez brzydkiego lub przynajmniej brzydkawego kodu znaczników, skażonego pewną ilością elementów służących wyłącznie prezentacji.
Ma to działać w IE6, tak w ogóle?
Jeśli nie i jeśli paski ze wzorkiem u góry i na dole mają stałą, znaną wysokość, to możesz zastosować pozycjonowanie absolutne.
@leadersmind:
Tabelka nie jest metodą jak każda inna. Gdy walidator uzna coś za błąd, to jest to... błędem, a niekoniecznie czymś przestarzałym. HTML starszy niż 4.01 jest obecnie przestarzały. W zasadzie to nawet doctype Transitional można uznać za przestarzały.Walidator W3C jest bardzo daleki od doskonałości. Nie sprawdza nawet całej składni, a co dopiero sensu strony. Zadaniem kodu znaczników jest oznaczenie struktury dokumentu. Walidator tego nie sprawdza, mimo że W3C silnie zaleca pewne rzeczy i odradza inne, definiując poprawne użycie strukturalnych elementów HTML-a.
Tabele służą do reprezentacji danych tabelarycznych. Użycie ich do layoutu przeczy zasadzie rozdzielenia warstw.
Nie wolno ściemniać, że wszystko jest z takim czymś OK, bo się waliduje. Świadczy to o niezrozumieniu samego HTML-a i/lub działania walidatora.
Gdy trzeba, to trzeba zastosować nieeleganckie rozwiązania. Czasem inaczej się po prostu nie da, a czasem rozwiązanie eleganckie jest zbyt skomplikowane i nieopłacalne (nie zawsze tworzy się kod najwyższej możliwej jakości mimo kłamstw jakie ludzie wypisują w działach "Misja i wizja naszej firmy"; nie zawsze klient potrzebuje najwyższej jakości za wszelką cenę).
W każdym razie nie ma co ściemniać, że wszystko jest z nieeleganckimi rozwiązaniami w porządku i że są one jak każde inne. Chyba że reszta Twojego kodu też jest nieelegancka ;).
Rozumiem, że sugerujesz iż to ja ściemniam. Bardzo dobrze rozumiem do czego służą tabelki i znam IDEE ich zastosowania. Co nie znaczy, że nie można ich używać inaczej. Wiem, jest taki nurt że tabeli są beee, ale jedynym argumentem jest to co podałeś. Jedna tabelka na stronie - nie wpłynie na jakość kodu tak jak sugerujesz. Czasami po prostu trzeba i tyle.
Chętnie poznam rozwiązanie problemu o którym tutaj mowa bez tabelki - popisz się w tej materii a nie rozpisujesz sie o tym o czym wszyscy wiedzą.