সমস্ত প্রধান ব্রাউজার ইঞ্জিন এখন CSS গ্রিড এবং ফ্লেক্সবক্সে শেষ বেসলাইন সারিবদ্ধকরণ সমর্থন করে।
ব্রাউজার সমর্থন
- 108
- 108
- 52
- 16.2
first
এবং last
কীওয়ার্ড ব্যবহার করে সারিবদ্ধকরণ এখন সমস্ত প্রধান ইঞ্জিনে উপলব্ধ। এর মানে হল যে আমরা ফ্লেক্স বা গ্রিড আইটেমগুলির গ্রুপগুলিকে সারিবদ্ধ করার সময় অন্য বিকল্প হিসাবে শেষ বেসলাইন সারিবদ্ধকরণ ব্যবহার করতে পারি।
প্রথম বেসলাইন প্রান্তিককরণ
আপনি যদি align-items
মান baseline
সেট করেন, ফলাফলটি হবে প্রথম বেসলাইন প্রান্তিককরণ। তাই আপনি যে আইটেমটি সারিবদ্ধ করছেন তার প্রথম বেসলাইনটি ( সারিবদ্ধকরণ বিষয় হিসাবে বর্ণনা করা হয়েছে) গ্রুপের অন্যান্য আইটেমের প্রথম বেসলাইনের সাথে সারিবদ্ধ হবে। আপনি নিম্নলিখিত উদাহরণে এটি দেখতে পারেন, যেখানে প্রথম দুটি ফ্লেক্স আইটেম align-items: baseline
, তাই তারা বৃহত্তর পাঠ্য দ্বারা তৈরি বেসলাইন বরাবর সারিবদ্ধ করে। চূড়ান্ত আইটেমটি flex-start
সাথে সারিবদ্ধ হয় এবং তাই ফ্লেক্স কন্টেইনারের শুরুতে সারিবদ্ধ হয়।
শেষ বেসলাইন প্রান্তিককরণ
একটি গ্রিড বা ফ্লেক্স আইটেমকে last baseline
মান দিয়ে সারিবদ্ধ করার সময়, সেই আইটেমের শেষ বেসলাইনটি বেসলাইন শেয়ারিং গ্রুপের শেষ বেসলাইনের সাথে সারিবদ্ধ হবে যার এটি অংশ। নিম্নলিখিত উদাহরণটি শেষ বেসলাইন সারিবদ্ধতা প্রদর্শন করে, প্রথম ফ্লেক্স আইটেমটি বড় আইটেমের পাঠ্যের শেষ লাইনের সাথে সারিবদ্ধ করে। এই গ্রুপের চূড়ান্ত আইটেমটি flex-end
সাথে সারিবদ্ধ করা হয়েছে, যা ফ্লেক্স কন্টেইনারের শেষ।
ফলব্যাক প্রান্তিককরণ
যদি প্রান্তিককরণ বিষয়ের সাথে সারিবদ্ধ করার জন্য একটি বেসলাইন শেয়ারিং গ্রুপ না থাকে, তাহলে একটি ফলব্যাক প্রান্তিককরণ ব্যবহার করা হবে। baseline
এবং first baseline
জন্য ফলব্যাক অ্যালাইনমেন্ট start
হয় এবং last baseline
জন্য ফলব্যাক অ্যালাইনমেন্ট end
হয়।