CSS-এ ইনলাইন-ব্লক উপাদানগুলিকে ডানদিকে সারিবদ্ধ করা
উপাদানটিকে ডানদিকে সারিবদ্ধ করা যাক:
html<div class="parent">
<span class="child">text</span>
</div>css.parent {
text-align: right;
padding: 10px 0;
border: 1px solid red;
}
.child {
display: inline-block;
padding: 10px 20px;
border: 1px solid green;
}
Результат:
Задание 1
কিছু প্যারেন্টের ভিতরে একটি div দেওয়া আছে:
html<div class="parent">
<div class="child">text</div>
</div>css.parent {
padding: 10px 0;
border: 1px solid red;
}
.child {
padding: 10px;
border: 1px solid green;
}
div-child কে একটি ইনলাইন-ব্লক উপাদানে রূপান্তর করুন, তারপর এটিকে প্যারেন্টের ডানদিকে সারিবদ্ধ করুন।
Задание 2
পূর্ববর্তী কাজটি এমনভাবে পরিবর্তন করুন যাতে
div ডান প্রান্তে শক্তভাবে না লাগে।
এটির জন্য, প্যারেন্ট উপাদানে ডান padding যোগ করুন।
Задание 3
পূর্ববর্তী কাজটি এমনভাবে পরিবর্তন করুন যাতে
div ডান প্রান্তে শক্তভাবে না লাগে।
এটির জন্য, child উপাদানে ডান
margin সেট করুন।
Задание 4
কিছু প্যারেন্টের ভিতরে একটি লিঙ্ক দেওয়া আছে:
html<div class="parent">
<a href="" class="child">text</a>
</div>css.parent {
padding: 10px 0;
border: 1px solid red;
}
.child {
width: 100px;
padding: 10px;
border: 1px solid green;
}
লিঙ্কটিকে একটি ইনলাইন-ব্লক উপাদানে রূপান্তর করুন, তারপর এটিকে প্যারেন্টের ডানদিকে সারিবদ্ধ করুন।
Задание 5
পূর্ববর্তী কাজটি এমনভাবে পরিবর্তন করুন যাতে লিঙ্কের ভিতরের টেক্সটটি এই লিঙ্কের কেন্দ্রে সারিবদ্ধ হয়।