Informacje

Niniejsza strona została sformatowana przy użyciu CSS. Do utworzenia tego układu wykorzystano ujemne marginesy.

Najważniejsze cechy:

Zmień rozmiar tej strony, aby zaobserwować następujące zjawiska:

  1. Środkowa kolumna z treścią zmienia szerokość wraz ze zmianą szerokości okna.
  2. Własność min-width zapobiega zbytniemu ściśnięciu treści. Kiedy treść osiągnie określoną minimalną szerokość, dalej się nie zwęża.
  3. Własność max-width zapobiega zbytniemu rozciągnięciu treści. Kiedy treść osiągnie określoną maksymalną szerokość, dalej się nie rozszerza, a marginesy ustawione na auto ustawiają układ na środku strony.
  4. Stopka ustawia się pod najdłuższą kolumną.

Aby niniejszy układ działał bez zarzutów w przeglądarce IE 6, należy do dokumentu dołączyć plik minmax.js za pomocą znacznika script. Jest to spowodowane tym, że przeglądarka IE 6 nie obsługuje własności min-width i max-width.

Pliki biblioteki Stylib

W niniejszym układzie wykorzystano dwa pliki z biblioteki Stylib

  1. 3_col_liquid.css
  2. text_n_colors.css

Plik XHTML nosi nazwę

Obszar promo

Niniejsza kolumna ma ujemny margines, który pozwala na ustawienie jej wewnątrz elementu div z treścią. Dodatni margines elementu content tworzy miejsce dla tej kolumny.