Codingku

position

CSS Syntax

position: static | absolute | fixed | relative | sticky | initial | inherit;

JavaScript Syntax

object.style.position="absolute"
Default value:static
Inherited:tidak
Animatable:tidak Read about animatable
Version:CSS2

Attribute Value

default position: static;

Elemen akan tetap berada di aliran alami halaman.

Akibatnya, elemen ini tidak akan bertindak sebagai titik acuan untuk blok merah muda yang posisinya absolute.

Elemen ini tidak akan bereaksi terhadap sifat-sifat berikut:

  • top
  • bottom
  • left
  • right
  • z-index

position: relative;

Elemen akan tetap berada di aliran alami halaman.

Properti ini juga membuat elemen diposisikan: elemen ini akan bertindak sebagai titik acuan untuk blok merah muda yang posisinya absolute.

Elemen ini akan bereaksi terhadap sifat-sifat berikut:

  • top
  • bottom
  • left
  • right
  • z-index

position: absolute;

Elemen tidak akan tetap berada di aliran alami halaman. Elemen ini akan memposisikan dirinya menurut elemen induk terdekat yang posisinya relative.

Karena diposisikan, elemen ini akan bertindak sebagai titik acuan untuk blok merah muda yang posisinya absolute.

Elemen ini akan bereaksi terhadap sifat-sifat berikut:

  • top
  • bottom
  • left
  • right
  • z-index

position: fixed;

Elemen tidak akan tetap berada di aliran alami halaman. Elemen ini akan memposisikan dirinya sesuai dengan viewport.

Karena diposisikan, elemen ini akan bertindak sebagai titik acuan untuk blok merah muda yang posisinya absolute.

Elemen ini akan bereaksi terhadap sifat-sifat berikut:

  • top
  • bottom
  • left
  • right
  • z-index