Posisi absolute css
Posisi absolute dalam CSS memungkinkan Anda mengatur posisi suatu elemen secara bebas di dalam kontainernya. Ketika sebuah elemen memiliki posisi absolute, elemen tersebut dianggap terpisah dari aliran dokumen normal dan tidak memengaruhi tata letak elemen-elemen lain dalam aliran dokumen.
Berikut adalah beberapa hal yang perlu diketahui tentang posisi absolute dalam CSS:
Ketika sebuah elemen memiliki posisi absolute, properti-posisi CSS seperti top, bottom, left, dan right dapat digunakan untuk menentukan posisi elemen tersebut relatif terhadap elemen yang memiliki posisi relatif atau terhadap elemen yang memiliki posisi absolute yang lebih tinggi di dalam hierarki.
Jika tidak ada elemen yang memiliki posisi relatif atau absolute yang lebih tinggi di dalam hierarki, elemen dengan posisi absolute akan ditempatkan relatif terhadap body atau elemen yang memiliki posisi relative terdekat.
Elemen dengan posisi absolute dikeluarkan dari aliran dokumen normal, sehingga elemen-elemen lain tidak memperhitungkannya saat menentukan tata letaknya.
Jika ada elemen-elemen lain di dalam kontainer yang memiliki posisi absolute, elemen-elemen tersebut akan tumpang tindih sesuai dengan urutan mereka dalam markup HTML dan dengan menggunakan properti-posisi CSS yang sesuai.
Untuk mengatur posisi absolute pada elemen dalam CSS, Anda dapat menggunakan properti position: absolute;. Selain itu, Anda juga dapat menggunakan properti-posisi CSS seperti top, bottom, left, dan right untuk menentukan posisi elemen tersebut secara spesifik.
Contoh penggunaan posisi absolute dalam CSS:
css
Copy code
.container {
position: relative;
}
.absolute-element {
position: absolute;
top: 50px;
left: 20px;
}
Pada contoh di atas, elemen dengan kelas "absolute-element" memiliki posisi absolute. Ini akan ditempatkan secara relatif terhadap elemen dengan kelas "container" yang memiliki posisi relatif. Elemen tersebut akan berjarak 50 piksel dari bagian atas dan 20 piksel dari bagian kiri dari posisi normalnya dalam aliran dokumen.
