Pada pertemuan yang lalu kita telah mempelajari tentang display. Dan saat ini kita akan mempelajari tentang 2 Dimensi dan overflow. Sebernya pada pertemuan sebelumnya kita sudah mempelajari tentang 2 Dimensi. Apa saja sih 2 Dimensi itu. 2 Dimensi itu terdiri dari:

  1. Width : Lebar, dan
  2. Height : Tinggi

Satuan yang biasanya di gunakan untuk 2 Dimensi antara lain adalah:

  1. px (pixel),
  2. % (persen)

Contohnya yaitu:

Overflow adalah cara kita untuk mengatur element yang keluar dari dimensinya. contohnya yang seperti ini:

Dan cara kita untuk memperbaikinya adalah dengan memberikan overflow. Ada 4 value pada overflow yaitu:

  1. visible
  2. auto
  3. hidden
  4. scroll
  1. visible

Visible artinya apabila ada konten yang keluar dari parentnya dia akan diperlihatkan. Contohnya yaitu sebagai berikut:

2. auto

Auto artinya jika ada konten yang keluar dari parentnya maka akan di tambahkan scroll untu mempermudah melihatnya. contohnya sebagai berikut:

codenya sebagai berikut:

Dan hasilnya adalah sebagai berikut:

Lihat dengan teliti sudah ada tombol scroll nya bukan. Artinya kita telah berhasil.???. Misalkan kontennya cukup maka tidak akan ada tombol scroll.

3. Hidden

Hidden artinya apabila kontennya melewati parent nya maka konten selanjutnya tidak akan di tampilkan. Contohnya sebagai berikut:

4. scroll

Scroll ini sama seperti auto bedanya adalah apabila kontennya cukup tetap akan di munculkan tombol scroll nya. Contohnya sebagai berikut:

Apabila kontennya lebih:

Jika kontennya cukup:

Sekian terima kasih

baca juga lainnya di website Dhuo Creative.

baca juga tentang semangat menjadi programmer.

Nindya

Kamu Mau, Kamu Pasti Bisa

http://web.dhuocreative.com
X