সিএসএস-এ মার্জিন বনাম প্যাডিং

সিএসএস-এ মার্জিন এবং প্যাডিংয়ের মধ্যে পার্থক্য সম্পর্কে জানুন।

মার্জিন বনাম প্যাডিং

আসুন সংক্ষিপ্ত সংজ্ঞা দিয়ে শুরু করি:

যখন আপনি একটি HTML উপাদানে মার্জিন বা প্যাডিং প্রয়োগ করেন, তখন তারা উপাদানটিকে ভিন্নভাবে প্রভাবিত করে:

উপরের ধারণাগত চিত্রটি মাথায় রেখে, আসুন এই জ্ঞানটিকে একটি বাস্তব HTML উপাদানে প্রয়োগ করি।

উপরে একটি সহজ <button> আছে একটি <div> ভিতরে উপাদান ধারক

বোতামটিতে রয়েছে:

24px মার্জিন যা বোতামের চারপাশে স্থান যোগ করে এবং এটিকে ভিতরে থাকা মূল উপাদানের সীমানা থেকে দূরে ঠেলে দেয়।
4px সীমানা
16px প্যাডিং যা বোতামের সীমানা এবং এর বিষয়বস্তুর মধ্যে স্থান যোগ করে।
সামগ্রী (এই ক্ষেত্রে, পাঠ্য লেবেল:বোতাম)

button {
    padding: 16px; 
    margin: 24px; 
    border: 4px solid #282828;
}

উভয়ই margin এবং padding বৈশিষ্ট্য হোয়াইটস্পেস নিয়ন্ত্রণ করে। যাইহোক, তারা কীভাবে এটি প্রয়োগ করে তার বিপরীতে তাদের কার্যকারিতা রয়েছে।