Cara Menggunakan Property Min-Height Dan Max-Height Di CSS

Pada kesempatan kali ini saya akan menjelaskan cara menggunakan property min-height dan max-height di css. Mungkin sebagian dari teman-teman ada yang sudah memahaminya, untuk yang belum memahaminya perlu di ketahui min-height adalah singkatan dari minimal height dan max height adalah singkatan dari maximal height. Maksud dari minimal height tersebut dimana ketika teman-teman memiliki suatu element yang konten di dalamnya sedikit tentunya akan mengakibatkan tinggi dari element tersebut menjadi kecil dan jika ingin di samakan tinggi element tersebut dengan element lain, maka teman-teman cukup menggunakan minimal height , yang nantinya element tersebut akan memiliki tinggi yang sama dengan element tersebut.

min-height tersebut tidak jauh berbeda dengan min-width (minimal width). Jika pada min-width bisa di gunakan untuk menentukan lebar minimal suatu element, maka min-height dapat di gunakan untuk menentukan tinggi minimal suatu elemen untuk alasan-alasan khusus seperti pada kasus penjelasan sebelumnya. Nilai dari min-height akan membuat suatu element mempunyai batas minimal tinggi tertentu (sesuai dengan nilai yang di gunakan nya). Jika teman-teman menghendaki elemen yang mempunyai batas tinggi maksimal tertentu, teman-teman bisa menambahkan property overflow:auto .

Berikut Di Bawah Ini Satuan Nilai Yang Dapat Digunakan Untuk Menentukan min-height :

• px (pixel), em, pt, cm (centi meter), dll
• % (persen)

Contohnya seperti kode di bawah ini :

max-height pun sama, tidak jauh berbeda dengan max-width (maximall width). Jika pada max-width bisa di gunakan untuk menentukan lebar maximall suatu element, maka max-height dapat di gunakan untuk menentukan tinggi maximall suatu elemen untuk alasan-alasan khusus. Nilai dari max-height akan membuat suatu element yang mempunyai batas maximall tinggi tertentu (sesuai dengan nilai yang di gunakan nya). Dan untuk satuan nilai yang dapat digunakan untuk menentukan max-height tersebut sama halnya seperti satuan nilai pada min-height.

Berikut contoh penggunaan max-height seperti kode di bawah ini :

Untuk penggunaan nilai tersebut sesuaikan dengan keinginan teman-teman, karena dalam hal ini bisa berbeda-beda satu dengan yang lain nya.

Sekian penjelasan saya mengenai cara menggunakan property min-height dan max-height di css, semoga bermanfaat.