Rozmiary - CSS
Blok obejmujący CSS
Jak wyznaczyć element, względem którego obliczana jest pozycja i rozmiary elementów?
Pozycja i rozmiar pudełka elementu są czasami obliczane względem pewnego prostokąta zwanego blokiem obejmującym (ang. "containing block"):
- Blok obejmujący w którym znajduje się element podstawowy (ang. "root") jest wyznaczany przez przeglądarkę (np. okno). Ten blok nazywany jest początkowym blokiem obejmującym.
- Dla innych elementów, które mają ustalone pozycjonowanie relatywne lub statyczne blok obejmujący jest tworzony przez najbliższy blok, komórkę tabeli lub inline-block będący przodkiem dla danego elementu.
- Jeśli element jest pozycjonowany w sposób ustalony, blok obejmujący wyznacza okno przeglądarki.
- Jeśli element jest pozycjonowany absolutnie, blok obejmujący jest wyznaczony przez najbliższego przodka z pozycjonowaniem absolutnym, relatywnym lub ustalonym w następujący sposób:
- Jeśli przodek jest wyświetlany jako inline-block i kierunek tekstu (
direction
) jest określony jako ltr (od lewej do prawej) góra i lewa strona bloku obejmującego jest górną i lewą krawędzią zawartości pierwszego pudełka utworzonego przez przodka, natomiast dół i prawa krawędź jest dolną i prawą krawędzią zawartości ostatniego pudełka przodka. - W przypadku kierunku tekstu rtl (od prawej do lewej) wszystko jest odwrotnie.
- Jeśli przodek jest wyświetlany jako inline-block i kierunek tekstu (
- W przeciwnym razie obejmujący blok jest tworzony przez krawędzie marginesu wewnętrznego (padding) przodka.