CSS Layout - display: inline-block

-

ناقشنا هذه الخاصية في درس  CSS Layout - The display Property، في هذا الدرس بنعمل مقارنه بين display: inline و display: inline-block .

الاختلاف بينهما هو ان inline-block تسمح بالتحكم بالطول والعرض ل element


الاختلاف 
inline
inline-block
block
التحكم ب width  و height 
لا يمكن 
يمكن
يمكن
التحكم ب  top and bottom margins, paddings
لا يمكن
يمكن
يمكن
إضافة line-break بعد element (العنصر التالي سيكون بجانب الحالي)
لا يمكن
لا يمكن
يمكن

طريقة الكتابة 

display: inline;
display: inline-block;
display: block;