Max-width Dalam CSS
Dalam mengatur lebar, kita sering menggunakan width sebagai property, ex.
div {
width:500px;
margin: auto;
border: 3px solid #73AD21;
}
maka settingan diatas akan membuat ukuran border tetap yaitu 500px saat browser di perkecil kurang dari 500px , jadi akan ada bagian border yang tidak terlihat. Bagaimana cara mengatasinya?
caranya yaitu menggunakan properti max-width
ex.
<!DOCTYPE html>
<html>
<head>
<style>
div.ex1 {
width:500px;
margin: auto;
border: 3px solid #73AD21;
}
div.ex2 {
max-width:500px;
margin: auto;
border: 3px solid #73AD21;
}
</style>
</head>
<body>
<div class="ex1">This div element has width: 500px;</div> <br>
<div class="ex2">This div element has max-width: 500px;</div>
<p><strong>cara mengecek:</strong> geser atau perkecil browser anda kurang dari 500px , maka anda akan mengetahui perbedaanya</p>
</body>
</html>
Semoga Bermanfaat.
Written by @akhi_syabab
Programmer python yang punya banyak ambisi.
Remote developer at remoteworker.id Software Agency