Strona poświęcona projektowaniu szablonów WWW

Elementy liniowe

Elementy liniowe to takie, które zachowują się jak linie tekstu, czyli innymi słowy "płyną" razem z tekstem.

Nie można określić im wymiarów za pomocą właściwości width i height.

Nie można nadwać im górnych (margin-top), ani dolnych (margin-bottom) marginesów. Nadanie margin-left lub margin-right oraz wypełnień jednak w ich przypadku zadziała.

Biorąc pod uwagę, że elementy liniowe zachowują się podobnie, jak linie tekstu, można określać ich wyrównanie w pionie za pomocą właściwości vertical-align. Zachowanie vertical-align zostało bardzo przejrzyście wytłumaczone w artykule na BitsOfCo.de.

Przykładowe elementy liniowe, które już udało nam się poznać to <span> oraz <a>.

Warto w tym momencie wspomnieć, że istnieją elementy, których domyślne zachowanie nieco różni się od blokowych i liniowych. Można powiedzieć, że łączą w sobie ich wybrane cechy. Są to tzw. replaced elements. Należą do nich m.in. <img>, <input> oraz <select>. Można określać ich wymiary za pomocą właściwości CSS, jednak w przeciwieństwie do elementów blokowych za żadnym z nich nie następuje złamanie linii. Zauważyliście to z pewnością podczas tworzenia formularzy w czystym HTML.