Back

9. CSS Flexbox

📘 কনসেপ্ট (থিওরি)

Flexbox হলো এক দিকে (সারি বা কলাম) আইটেম সাজানোর শক্তিশালী লেআউট সিস্টেম। **কন্টেইনার প্রপার্টি** (প্যারেন্টে): - display: flex — Flexbox সক্রিয় করে - flex-directionrow, column, row-reverse, column-reverse - justify-content — মূল অক্ষে সারিবদ্ধকরণ: flex-start, center, flex-end, space-between, space-around, space-evenly - align-items — ক্রস অক্ষে সারিবদ্ধকরণ: flex-start, center, flex-end, stretch - flex-wrapwrap, nowrap - gap — আইটেমের মধ্যে ফাঁকা **আইটেম প্রপার্টি** (চিলড্রেনে): - flex: 1 — উপলব্ধ জায়গা পূরণ করতে বাড়ে - flex-shrink — কতটুকু সংকুচিত হবে - order — দৃশ্যমান ক্রম পরিবর্তন - align-self — একটি আইটেমের জন্য align-items ওভাররাইড

💡 উদাহরণ

Flexbox লেআউট:

🎯 আপনার কাজ (প্র্যাকটিস)

Flexbox ব্যবহার করে বামে লোগো এবং ডানে ৩টি নেভিগেশন লিংকসহ একটি নেভবার তৈরি করুন।
main.css
Loading...
OUTPUT
Run your code to see the output here...