و inline-block قيمة
كان من الممكن لفترة طويلة لإنشاء شبكة من المربعات التي تملأ عرض المتصفح ويلتف جيد (عند تغيير حجم المتصفح)، باستخدام float الممتلكات.
ومع ذلك، فإن inline-block قيمة display الممتلكات يجعل هذا أسهل.
inline-block العناصر مثل العناصر المضمنة كنها يمكن أن يكون لها عرض وارتفاع.
أمثلة
الطريقة القديمة - استخدام float (لاحظ أننا في حاجة أيضا إلى تحديد clear الملكية للعنصر بعد صناديق عائمة):
مثال
.floating-box {
float: left;
width: 150px;
height: 75px;
margin: 10px;
border: 3px solid #73AD21;
}
.after-box {
clear: left;
} انها محاولة لنفسك » نفس التأثير يمكن تحقيقه باستخدام inline-block قيمة display الملكية (لاحظ أنه لا توجد clear وهناك حاجة الملكية):
مثال
.floating-box {
display: inline-block;
width: 150px;
height: 75px;
margin: 10px;
border: 3px solid #73AD21;
} انها محاولة لنفسك »