Sposób wyświetlania: display

Elementy blokowe: display:block Bug w IE

Elementy blokowe w CSS to co innego, niż elementy blokowe XHTML.

Element będzie traktowany jako prostokąt i domyślnie będzie sam w linii (o ile tego nie zmieni float lub position).

Elementy blokowe mogą mieć nadane wymiary i ich pionowe marginesy wpływają na sąsiednie elementy. Nie reagują na text-align.

Elementy liniowe: display:inline Bug w IE

Elementy liniowe w CSS to co innego, niż elementy liniowe XHTML.

Elementy liniowe zachowują się jak tekst i mogą być przenoszone do nowej linii.

Elemeny liniowe nie mogą mieć nadanych wymiarów (poza line-height). Pionowe marginesy i padding nie odsuwają linii od siebie.

Elementy liniowo-blokowe: display:inline-block Bug w IE Bug w FF

Są elementami blokowymi umieszczonymi w linii tekstu tak, jak elementy liniowe. Zawartość elementów inline-block może być dowolna. Można nadać im wymiary.

Elementy wstawione: display:run-in Bug w IE Bug w FF

Element z display:run-in stanie się pierwszym elementem liniowym w następnym bloku. Jest to efekt nieco przypominający float:left.

Dzięki temu można zrobić nagłówki oraz terminy definicji w tej samej linii, co tekst za nimi.

 <h1>Nagłówek</h1>
 <p>Tekst</p>

 Nagłówek Tekst

Elementy tabel: display:table Bug w IE

Zostały opisane oddzielnie

Elementy niewidoczne: display:none

Zostały opisane oddzielnie

Właściwości zmieniające display Bug w IE6

Elementy pozycjonowane absolutnie oraz float zawsze mają wymuszony display:block niezależnie od wartości podanej w arkuszu.

Pytania? Komentarze? Napisz na forum kursu lub edytuj tę stronę.


Zmodyfikowano: 16.10.2006, 13:04