Kode CSS min width property

min width property berfungsi untuk menentukan "lebar minimal" sebuah elemen. Melalui property ini sebuah elemen akan selalu mempunyai lebar minimal sesuai nilai yang ditentukan. Dalam penggunaanya, css min-width property biasanya selalu digunakan secara bersamaan dengan max-width property. Hampir semua browser sudah mendukung css2 min-width property, termasuk IE-8 dan IE-9. Value/nilai dari min-width ditetapkan dalam px, em, cm (length), % (persen) dan inherit.

Deklarasi css min-width property

min-width: value;
min-width: 100px;
min-width: 20em;
min-width: 10%;

Contoh penerapan min-width property

<style type="text/css">
p {
      padding: 10px;
      color: #000;
      background: lightgreen;
      border: 1px solid #444;
      min-width: 250px;
}
</style>

<p> Content here!</p>
<style type="text/css">
.mybox1 {
      padding: 10px;
      color: #000;
      background: yellow;
      border: 1px solid #444;
      width: 400px;
}
.mybox2 {
      display: inline-block; /* atau "display: block" untuk elemen selain div & p */
      padding: 10px; 
      background: lightgreen;
      min-width: 50%px;
}
</style>

<div class="mybox1">
<span class="mybox2">Content here!</span>
</div>
Edit kode dalam box demo online di bawah ini untuk mengetahui lebih jelas fungsi CSS min-width property.
Please click the button to display. Continue with editing code and click to see the results!

1 komentar:

  1. Sunggu bermanfaat tutorial css nya..

    Saya juga punya tutorial css di blog kang, monggo di baca sekalian di koreksi sama akang, takutnya ada yg salah :)

    Cara memilih element atau selector tertentu

    http://www.wappersunda.com/cara-memilih-element-atau-selector-terte.xhtml

    BalasHapus

My ProfileC l o s e

FollowerC l o s e