আইটেমের মাঝে ফাঁক দিতে অনেকে এখনো margin-right বা margin-bottom ব্যবহার
করেন। সমস্যা হলো শেষ আইটেমেও মার্জিন বসে যায়, তাই :last-child দিয়ে সেটা
আবার মুছতে হয়:
CSS
.item {
margin-right: 16px;
}
.item:last-child {
margin-right: 0;
}
gap শুধু আইটেমগুলোর মাঝে ফাঁক দেয়, বাইরে নয়:
CSS
.list {
display: flex;
gap: 16px;
}
দুই লাইন কম, আর র্যাপ হলেও ঠিক থাকে — মার্জিন দিয়ে করলে নতুন লাইনের উল্লম্ব ফাঁকটা আলাদা করে সামলাতে হতো।
gap এখন flexbox, grid আর multi-column — তিন জায়গাতেই কাজ করে।
মাসে একটা কাজের ইমেইল
ডিজাইন সিস্টেম প্যাটার্ন, ফ্রন্ট-এন্ড টেকনিক আর লার্ন প্ল্যাটফর্মের নোট। কোনো প্রচার নেই, অন্যের লিংকের সংকলনও নেই।