Hallo teman-teman Dumet School. Kembali lagi dengan saya di Kursus Web Design tempat kursus terbaik dan nomor satu. Kali ini saya akan membahas tentang cara Membuat Posisi Fixed Pada Sidebar Full Height Menggunakan CSS. Sebelumnya saya akan menjelaskan sedikit tentang property position pada css.

Property position pada css berfungsi untuk mengatur posisi pada sebuah elemen atau objek. Dimana nilai dari position ada 5, yaitu:

  • Relative berfungsi membuat suatu elemen dengan posisi relative terhadap posisi normalnya. Dan Menjadikan suatu objek sebagai induk terhadap posisi absolute.
  • Static berfungsi membuat suatu elemen dengan posisi sesuai dengan aliran normal halaman.
  • Fixed berfungsi membuat suatu elemen dengan diposisikan relatif terhadap area pandang, yang berarti selalu berada di tempat yang sama meskipun halaman di scroll.
  • Stiky berfungsi membuat suatu elemen lengket akan beralih antara relatif dan tetap, tergantung pada posisi gulir. Ini diposisikan relatif sampai posisi offset tertentu terpenuhi di area pandang – lalu “menempel” pada tempatnya (seperti posisi: tetap).
  • Absolute berfungsi membuat suatu elemen yang diposisikan mengikuti elemen dengan posisi relative.

Oke teman-teman, untuk Membuat Posisi Fixed Pada Sidebar Full Height Menggunakan CSS kita buat struktur htmlnya terlebih dahulu ya. Berikut scriptnya ya teman-teman.

Nah Jika sudah selesai kita masuk ke css. Berikut scriptnya ya teman-teman.

Nah jika sudah selesai maka teman-teman bisa buka di browser masing-masing. Tampilannya akan seperti pada gambar di bawah ini. Jika teman-teman scroll maka sidebarnya akan pada posisi tetap.

Membuat Posisi Fixed Pada Sidebar Full Height Menggunakan CSS

Demikian Artikel tentang cara Membuat Posisi Fixed Pada Sidebar Full Height Menggunakan CSS. Semoga bermanfaat dan selamt mencoba ya teman-teman.