Position: static, relative, absolute, fixed

La proprietà position definisce come un elemento è posizionato nel documento.

position: static (default)

Posizionamento normale nel flusso del documento.

position: relative

Posizionato relativamente alla sua posizione normale:

.box {
  position: relative;
  top: 10px;
  left: 20px;
}

position: absolute

Posizionato rispetto all'antenato posizionato più vicino:

.parent { position: relative; }
.child {
  position: absolute;
  top: 0;
  right: 0;
}

position: fixed

Posizionato rispetto alla viewport, rimane fisso durante lo scroll:

.navbar-fixed {
  position: fixed;
  top: 0;
  width: 100%;
}

Hai trovato utile quest'articolo?

  • Introduzione al CSS

    Il CSS (Cascading Style Sheets) è il linguaggio utilizzato per definire lo stile e la presentazione ...
  • Selettori CSS di base

    I selettori CSS permettono di identificare gli elementi HTML a cui applicare gli stili.Tipi di selet...
  • Proprietà color e background

    Le proprietà color e background sono fondamentali per definire l'aspetto visivo degli elementi.Propr...
  • Margin e Padding

    Margin e Padding controllano lo spazio intorno e dentro gli elementi.Differenza chiaveMargin: spazio...
  • Box Model CSS

    Il Box Model è il concetto fondamentale che descrive come ogni elemento HTML è rappresentato come un...