آیا margin با padding فرق داره؟
با اینکه مرتبا از دو خاصیت padding و margin برای افزودن حاشیه به المانهای مختلف استفاده کرده ام، لیکن هیچ وقت تفاوت دقیق بین این دو را درک نکرده بودم، تا اینکه امروز که داشتم کتاب CSS Anthology را ورق میزدم (البته پشت مانیتور!) متوجه تفاوت آنها شدم. هر چند در بسیاری مواقع می توان از این دو به جای هم دیگر استفاده کرد ولی تفاوت کوچکی با هم دارند: به طور ساده، margin حاشیه بیرونی است و padding حاشیه داخلی! برای اینکه تفاوت را خوب احساس کنید به چهار تا جعبه (div) زیر توجه کنید:
نوشته داخل این جعبه، فاقد هرگونه margin و padding است و البته کمی ناجور به نظر می رسد!
نوشته داخل این جعبه، دارای margin به اندازه ۱em و بدون padding است. ملاحظه می شود که از المانهای بیرونی اندکی فاصله گرفته ولی متن داخل آن به کادر چسبیده است! همچنان اندکی نافرم است.
نوشته داخل این جعبه، دارای padding به میزان ۱em است ولی margin ندارد. دقت کنید که این متن از کادر فاصله دارد ولی خود کادر از المانهای اطراف فاصله ندارد! کمی بهتر شد.
این جعبه نوشته، هم دارای margin و هم padding است. درست همان چیزی که می خواستیم!
کدهای این چهار جعبه در زیر مشاهده می شود.
خلیی هم عالی
سلام. ممنونم از این توضیحات کامل. بهترین بود
سلام
زنده باشید
دمت گرم داداش
اقا هر کی هستی من یکی خیلی دعات میکنم انصافا عالی بود واقعا که هضم شد کاملا برام
زنده باشید
عالی بود
در ضمن هر یه em برابر ۱۶px هست ایینم میگفتی عالی تر میشد
در کل خیلی مردی
زنده باشید.
ممنون
با سلام؛
بسیار عالی بود.
متاسفانه افرادی مثل بنده که تسلط کافی بر کدنویسی ندارند، می بایست برای یادگیری هر یک از این موارد زمان زیادی را صرف نمایند. در صورتی که با آموزش به این شیوه جذاب و کاربردی، زمان زیادی صرفه جویی می شود.
با تشکر.
علیکم السلام.
خواهش می کنم. زنده باشید
آقا مرسی
یعنی خدا وکیلی سایت w3schools هم اینقدر زیبا نمیتونست توضیح بده .
دمت مذاب…
لطف دارید
mikhamet be khoda
man ke kheyli gich shode bodam
مرسی از مطلبتون
عالی
دست شما درد نکنه
خیلی مفید بود
salam bar shoma in code amniati ro ke bara anti apam gozashtin asan tebghe ghaede nista khodetooon ye niga bokonin
movafagh bashin
مشکلش چیه؟
اینقدر نظرات اسپم زیاد شده بود که ناچار شدم یک کد امنیتی مناسب استفاده کنم.
خیلی ساده و خیلی خوشمزه.
عالی بوود.
ممنون
خوب بود
با سلام
عالی بود
ممنون
ممنون.عالی بود.
ممنون *خیلی باحالی!
دم شما گرم
آقا لطق کردی ممنون
آقا خدا خیرت بده به من که خیلی کمک کردی!!!
از این مطلب مفید بسیار استفاده کردیم، ممنون و سپاسگزارم. به قول معروف دم شما قیژ
ممنون
خداوند ۱۰۰ در دنیا ۱۰۰۰ در آخرت برای شما عنایت بفرمایند.انشاء الله
عالی بود حسین جان. مختصر و مفید. به قول خسرو ما رو از جهل در آوردی. لایک 🙂
واقعا واقعا جامع و عالی
بسیار عالییییییییییییییییییی
آقا ما رو از جهل بیرون آوردی ،دم شما گرم