ফ্লেক্সবক্স কন্টেইনারে বাটন থাকলে এবং justify-content: center দিয়ে হরিজন্টালি সেন্টার করলে, বাটনের হাইট প্যারেন্টের হাইট (৩০০পিক্সেল) পর্যন্ত স্ট্রেচ হয়ে যায়—যেটা সাধারণত ইচ্ছিত নয়।
সমাধান ১: align-items: center
ভার্টিক্যালি সেন্টার করলে স্ট্রেচ अपने আপ চলে যায়:
.container { height: 300px; display: flex; justify-content: center; align-items: center; }
সমাধান ২: height: max-content (ফ্লেক্স আইটেমে)
.button { height: max-content; }
এখন ফ্লেক্স আইটেমের হাইট এর কন্টেন্ট (টেক্সট + প্যাডিং) দ্বারা নির্ধারিত হবে।
সমাধান ৩: align-self: flex-start
.button { align-self: flex-start; }সিম্পল কেসে max-content-এর মতো ফলাফল দেয়, কিন্তু কনটেক্সট অনুযায়ী দুটো ট্রাই করে দেখুন।
