سلام خدمت همگی
چیزی که من متوجه شدم اینه که
عناصر inline با اینکه margin و padding میگیرن ولی عناصر مجاورشون رو به صورت افقی هل میدن و به صورت عمودی تفاوتی ایجاد نمیکنن و تفاوت اصلیشون با عناصر inline-block اینه که width ,height نمیپذیرن ,ینی هر عددی به این دو خاصیت بدی تاثیری نمیذارن
در مقابل inline-block باعث میشه که عناصر هم margin , padding بگیرن هم width و height
یعنی با ست کردن عددی برای عرض و ارتفاع , این عرض و ارتفاع برای عنصر در نظر گرفته میشه و تاثیرش قابل مشاهده اس
پس جمع بندی این شد که:
inline : مقادیر width و height نمیگیره و تاثیر margin padding اش روی عناصر مجاور و افقیه
inline-block : مقادیر width و height رو میپذیره و متناسب با اون ها تغییر میکنه
در مقایسه با نمایش: درون خطی ، تفاوت عمده آن در نمایشگر است: بلوک درون خطی امکان تنظیم عرض و ارتفاع روی عنصر را می دهد.
همچنین ، با صفحه نمایش: inline-block ، حاشیه/پدینگ بالا و پایین رعایت می شود ، اما با صفحه نمایش: inline آنها اینطور نیستند.
در مقایسه با نمایش: بلوک ، تفاوت عمده در نمایش اینست: بلوک درون خطی بعد از عنصر خط شکسته اضافه نمی کند ، بنابراین عنصر می تواند در کنار عناصر دیگر قرار گیرد.