Relative dan static css
Dalam konteks CSS (Cascading Style Sheets), "posisi relatif" dan "posisi statis" mengacu pada dua jenis posisi yang dapat diberikan pada elemen HTML.
Posisi Statis:
Posisi statis adalah posisi default untuk setiap elemen dalam aliran dokumen. Elemen dengan posisi statis ditempatkan berdasarkan aliran dokumen normal, yaitu elemen-elemen akan tumpang tindih sesuai dengan urutan mereka dalam markup HTML. Properti-posisi CSS untuk elemen dengan posisi statis diatur sebagai position: static; (atau tidak diatur sama sekali).
Posisi Relatif:
Posisi relatif memungkinkan Anda mengatur posisi suatu elemen dengan menggesernya relatif terhadap posisi normalnya dalam aliran dokumen. Dalam posisi relatif, elemen tetap memengaruhi tata letak elemen-elemen lain dalam aliran dokumen, tetapi dapat dipindahkan menggunakan properti-posisi CSS seperti top, bottom, left, dan right. Properti-posisi CSS untuk elemen dengan posisi relatif diatur sebagai position: relative;.
Berikut adalah perbedaan antara posisi relatif dan statis:
Posisi Statis:
Elemen berada pada posisi default dalam aliran dokumen.
Properti-posisi CSS tidak berlaku pada elemen tersebut.
Elemen tidak dipengaruhi oleh properti top, bottom, left, dan right.
Posisi Relatif:
Elemen tetap berada dalam aliran dokumen normal, tetapi dapat digeser dengan menggunakan properti-posisi CSS.
Properti-posisi CSS seperti top, bottom, left, dan right dapat digunakan untuk memindahkan elemen relatif terhadap posisi normalnya.
Elemen dengan posisi relatif masih memengaruhi tata letak elemen-elemen lain dalam aliran dokumen.
Dalam CSS, Anda dapat menggunakan posisi relatif untuk menggeser elemen secara relatif terhadap posisi normalnya, sementara posisi statis adalah posisi default yang tidak mengalami pergeseran.