Membuat element sticky (yang menempel) pada desain webmu

Di postingan ini saya akan membagikan tips yang sangat sederhana untuk membuat sebuah elemen html di halaman web kamu tampil sticky, yang artinya jika kamu scroll, ke atas ataupun ke bawah elemen tersebut tetap diam di situ, nempel dan idak bergerak. Contohnya seperti header halaman web kita buat sticky supaya saat discroll ke bawah, menu-menu yang ada di header halaman tetap kelihatan dan bisa diklik sewaktu-waktu.

Cara membuat sebuah elemn html menjadi sticky cukup mudah, kamu tinggal menambahkan css ini, misal pada class “nempel”:

.nempel{
   position: sticky;
   top: 0;
}

Alternatifnya, kita juga bisa membuat styling seperti ini:

.nempel{
   position: fixed;
   top: 0;
}

Misal kita mau membuat tombol “scroll to top” di pojok kanan bawah halaman web kita, bisa kita buat stylingnya begini:

.scrolltotop{
   position: fixed;
   bottom: 0;
   right: 0;
}