The inline-block Nilai
Ini telah dimungkinkan untuk waktu yang lama untuk membuat kotak kotak yang mengisi lebar peramban dan membungkus baik (ketika browser diubah ukurannya), dengan menggunakan float properti.
Namun, inline-block nilai display properti membuat ini lebih mudah.
inline-block elemen seperti elemen inline tetapi mereka dapat memiliki lebar dan tinggi a.
contoh
Cara lama - menggunakan float (perhatikan bahwa kita juga perlu menentukan clear properti untuk elemen setelah kotak mengambang):
Contoh
.floating-box {
float: left;
width: 150px;
height: 75px;
margin: 10px;
border: 3px solid #73AD21;
}
.after-box {
clear: left;
} Cobalah sendiri " Efek yang sama dapat dicapai dengan menggunakan inline-block nilai display properti (perhatikan bahwa tidak ada clear properti yang diperlukan):
Contoh
.floating-box {
display: inline-block;
width: 150px;
height: 75px;
margin: 10px;
border: 3px solid #73AD21;
} Cobalah sendiri "