Skocz do zawartości

Nakładanie warstw i za krótkie kolumny


J@sió
 Udostępnij

Rekomendowane odpowiedzi

Zainspirowany postem Normanosa postanowiłem przerobić swoją stronę na beztabelkową. Mam jednak 2 problemy, z którymi nie mogę się uporać. Aby je zobrazować, wklejam poniższy prowizoryczny obrazek

www.gif

Znaczenie kolorów:

czarny: tło strony zdefiniowane w sekcji body

szary: logo i dodatkowa grafika

niebieski: tło kolumn

zielony: główna sekcja strony, to tutaj jest jej treść

czerwony: podkład graficzny dla menu

biały: zawartość menu

Wszystko z wyjątkiem tła dokumentu (kolor czarny) ustawiam za pomocą DIVów i "position: absolute". A oto problemy:

1. jak widzicie, główna sekcja strony jest dłuższa niż boczne kolumny. Jak je wyrównać?

Nie pomaga wpisanie w CSS dla bocznych kolumn ani atrybutu "height: 100%" ani "bottom: 0px", zawsze są za krótkie. W jakimś wątku przeczytałem coś o "clear: both", ale po dopisaniu tego do bocznych kolumn i/lub głównej sekcji nie było poprawy

2. wiadomo, że warstwy zawarte w DIVach nakładają się na siebie w kolejności występowania w pliku (X)HTML. Czyli aby uzyskać efekt z powyższego obrazka trzeba najpierw "położyć" warstwę niebieską, potem czerwoną, a na końcu białą. Jednak ze względu na pozycjonowanie strony chciałbym poszczególne elementy strony umieszczać w innej kolejności w pliku HTML. Czy wobec tego istnieje jakiś atrybut, który nakaże przeglądarce zmienić kolejność nakładania warstw?

Konkretnie chodzi o to, że chciałbym najpierw wpisać główną sekcję strony, potem zawartość menu, a na końcu całę resztę. Niestety nie udało mi się sprawić, aby zawartość menu była na samym wierzchu, nad tłem kolumny oraz nad podkładem graficznym menu.

Czy ktoś borykał się z takim problemem i udało mu się go przezwyciężyć?

zamki polskie, pałace i dwory obronne

Odnośnik do komentarza
Udostępnij na innych stronach

Klasyczny 3 kolumnowy lay. Na początek może być nieco za trudny, więc radzę skorzystać z https://www.forum.optymalizacja.com/index.php?showtopic=10130 lektury tego tematu. Dałem tam linka do najlepszego moim zdaniem 3 kolumnowego laya na divach. Pozdrawiam

Dała matka rozum? To kombinuj.

Odnośnik do komentarza
Udostępnij na innych stronach

1. jak widzicie, główna sekcja strony jest dłuższa niż boczne kolumny. Jak je wyrównać? [...]

2. [...] Czy wobec tego istnieje jakiś atrybut, który nakaże przeglądarce zmienić kolejność nakładania warstw?

1. faux columns

2. negative margins

obydwa pojecia omowione na alistapart, google droge ci wskaze.

Odnośnik do komentarza
Udostępnij na innych stronach

2. wiadomo, że warstwy zawarte w DIVach nakładają się na siebie w kolejności występowania w pliku (X)HTML.

Czyli aby uzyskać efekt z powyższego obrazka trzeba najpierw "położyć" warstwę niebieską, potem czerwoną, a na końcu białą. Jednak ze względu na pozycjonowanie strony chciałbym poszczególne elementy strony umieszczać w innej kolejności w pliku HTML. Czy wobec tego istnieje jakiś atrybut, który nakaże przeglądarce zmienić kolejność nakładania warstw?

z-index: 1

ustaiwasz warstwy dla diva

Odnośnik do komentarza
Udostępnij na innych stronach

Jeśli chcesz dodać odpowiedź, zaloguj się lub zarejestruj nowe konto

Jedynie zarejestrowani użytkownicy mogą komentować zawartość tej strony.

Zarejestruj nowe konto

Załóż nowe konto. To bardzo proste!

Zarejestruj się

Zaloguj się

Posiadasz już konto? Zaloguj się poniżej.

Zaloguj się
 Udostępnij

  • Ostatnio przeglądający   0 użytkowników

    • Brak zarejestrowanych użytkowników przeglądających tę stronę.
×
×
  • Dodaj nową pozycję...

Powiadomienie o plikach cookie

Umieściliśmy na Twoim urządzeniu pliki cookie, aby pomóc Ci usprawnić przeglądanie strony. Możesz dostosować ustawienia plików cookie, w przeciwnym wypadku zakładamy, że wyrażasz na to zgodę. Warunki użytkowania Polityka prywatności