Desain Web Layout Pada HTML

Mengatur Posisi Elemen

CSS memiliki beberapa pilihan untuk mengatur posisi elemen pada layout sebuah halaman, yakni normal flow, relative positioning, dan absolut. Untuk menentukan posisi sebuah elemen, bisa menggunakan property position.

Setiap elemen block-level selalu muncul dalam baris baru, hal ini menyebabkan setiap item selalu muncul di bawah item sebelumnya. Walaupun anda mengatur lebarnya dan sebenarnya ada ruang untuk saling berdampingan, maka tetap tidak akan tampil seperti itu. Ini merupakan posisi secara default pada browser, kecuali anda menentukan yang lain.

Pengaturan posisi ini akan menggeser elemen dari posisi defaultnya. Pergeseran bisa ke arah atas, bawah, kanan, atau kiri dari posisi seharusnya. Pergeseran ini tidak akan merubah posisi elemen disekitarnya, elemen -elemen tersebut tetap akan berada pada normal flow.

Pengaturan posisi ini akan menempatkan elemen berkaitan dengan elemen yang menaunginya atau elemen parentnya. Pengaturan posisi ini sudah tidak mengikuti normal flow lagi yang juga berarti tidak akan berefek pada posisi elemen-elemen disekitarnya. Posisi absolut akan berubah saat pengguna menggulung layarnya melalui scroll.