CSS Layout - Overflow

Overflow adalah Konten biasanya lebih besar dari wadahnya.

Properti overflow-x menentukan apa yang harus dilakukan ketika konten melampaui tepi kiri dan kanan elemen.

Properti overflow-y menentukan apa yang harus dilakukan ketika konten melampaui batas atas dan ujung bawah.

Nilai valid:

visible : Konten tidak terpotong, memimpikan konten diberikan di luar tepi kotak.

hidden: Konten terpotong jika perlu dan tidak terlihat.

scroll :Konten terpotong jika perlu agar sesuai dengan kotak padding Dan akan bisa di gulir.

text ini bisa di scroll

auto : Jika konten muat di dalam kotak padding, ia berfungsi sama seperti visible; Jika konten meluap kotak padding berfungsi seperti scroll

Overflow-X

css

visible

.contoh-over {
   overflow-x: visible;
}

hiden

.contoh-over {
   overflow-x: hidden;
}

scroll

.contoh-over {
   overflow-x: scroll;
}

auto

.contoh-over {
   overflow-x: auto;
}

Overflow-Y

css

visible

.contoh-over {
   overflow-y: visible;
}

hiden

.contoh-over {
   overflow-y: hidden;
}

scroll

.contoh-over {
   overflow-y: scroll;
}

auto

.contoh-over {
   overflow-y: auto;
}