Back

11. CSS Positioning

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

position প্রপার্টি নিয়ন্ত্রণ করে পেজে এলিমেন্ট কীভাবে স্থাপিত হবে। - **static** (ডিফল্ট) — স্বাভাবিক ডকুমেন্ট ফ্লো - **relative** — স্বাভাবিক অবস্থানের সাপেক্ষে - **absolute** — নিকটতম পজিশনড পূর্বসূরির সাপেক্ষে - **fixed** — ভিউপোর্টের সাপেক্ষে (স্ক্রল করলেও থাকে) - **sticky** — স্ক্রলের উপর ভিত্তি করে relative ও fixed এর মধ্যে পরিবর্তন হয় position সেট করার পর (static ছাড়া), top, right, bottom, left দিয়ে এলিমেন্ট সরানো যায়। **z-index** স্ট্যাকিং অর্ডার নিয়ন্ত্রণ করে (কোন এলিমেন্ট উপরে):
.popup { position: fixed; z-index: 999; }

💡 উদাহরণ

পজিশনিং উদাহরণ:
নতুন

ব্যাজসহ কার্ড

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

absolute positioning ব্যবহার করে উপরে-ডানে "NEW" ব্যাজসহ একটি কার্ড তৈরি করুন।
main.css
Loading...
OUTPUT
Run your code to see the output here...