เว็บบอร์ด PHP เว็บส่งเสริมการเรียนรู้ Hosting CRM ERP Server Programming ถาม-ตอบปัญหา

margin และ padding ต่างกันอย่างไร
ทุกคนที่ฝึกเขียนจะต้องมีคนเคยสงสัยว่าระหว่างmarginกับpaddingนั้นมันทำงานต่างกันยังไง
บางคนก็ยังแยกไม่ออกว่าอะไรคือจุดแบ่งของทั้งสองอย่างนี้



https://medium.com/arcadia-software-dev ... 8c2848ae1e

ตามรูปจะเห็นว่าmarginนั้นมีพื้นที่สีฟ้าเป็นพื้นที่ว่างระหว่างborderกับelement
ส่วนpaddingที่เป็นพื้นที่สีเขียว จะอยู่ด้านใบของborderซึ่งมีหน้าจะช่องว่างระหว่างborderกับcontent
จากรูปจะทำให้เห็นความแตกต่างของการจัดรูปแบบ จริงๆแล้วมันทำงานคนล่ะส่วนกันเลย หวังว่าจะเพิ่มความเข้าใจ

บทควาวที่เกี่ยวข้อง
การใช้งาน Padding ช่วยจัดรูปภาพหรือข้อความ