CSS দিয়ে কোনো এলিমেন্টকে তার কন্টেইনারের নিচে (bottom) পিন করার পদ্ধতি শিখুন।
HTML-এ প্যারেন্ট-চাইল্ড রিলেশনশিপ থাকে। চাইল্ড এলিমেন্টকে প্যারেন্ট কন্টেইনারের নিচে রাখতে নিচের প্রপার্টিগুলো লাগে:
position: relative;(প্যারেন্ট)position: absolute;(চাইল্ড)bottom: 0;(চাইল্ড)
উদাহরণ
<div class="parent">
<div class="child"></div>
</div>
.parent { position: relative; }
.child { position: absolute; bottom: 0; }
দৃশ্যমান করতে স্টাইলিং
.parent { position: relative; background-color: black; height: 200px; width: 200px; }
.child { position: absolute; bottom: 0; background-color: darkred; height: 50px; width: 50px; }
চাইল্ড এলিমেন্ট অটোমেটিক্যালি কন্টেইনারের বাম পাশে পিন হয়।
নিচে ডানে (bottom-right) পিন করতে
.child { position: absolute; bottom: 0; right: 0; }