Punimi me vetinë display në CSS

Ju tashmë e dini se të gjithë etiketat i përkasin një modeli të caktuar blloku. Megjithatë, nëse dëshironi, mund të ndryshoni modelin duke përdorur vetinë display. Duke përdorur vlerën block të kësaj vetie një element mund të bëhet bllok, ndërsa duke përdorur vlerën inline - inline.

Le t'i bëjmë etiketat span të sillen si elemente blloku:

html<span>text</span>
<span>text</span>
<span>text</span>

cssspan {
  display: block;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-bottom: 20px;
}

Результат:

Dhe tani le t'i bëjmë etiketat div të sillen si inline:

html<div>text</div>
<div>text</div>
<div>text</div>

cssdiv {
  display: inline;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат: