উত্তর:
overflow:auto;উপস্থিত ডিভের উপর এটির অভ্যন্তরে সমস্ত কিছু (এমনকি ভাসমান আইটেমগুলি) দৃশ্যমান হয় এবং বাইরের ডিভটি পুরোপুরি তাদের চারপাশে আবৃত করে। এই উদাহরণটি দেখুন:
.wrap {
padding: 1em;
overflow: auto;
background: silver;
}
.float {
float: left;
width: 40%;
background: white;
margin: 0 1%;
}<div class="wrap">
<div class="float">Cras mattis iudicium purus sit amet fermentum. At nos hinc posthac, sitientis piros Afros. Qui ipsorum lingua Celtae, nostra Galli appellantur. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Ambitioni dedisse scripsisse iudicaretur.</div>
<div class="float">Mercedem aut nummos unde unde extricat, amaras. A communi observantia non est recedendum. Quisque ut dolor gravida, placerat libero vel, euismod. Paullum deliquit, ponderibus modulisque suis ratio utitur.</div>
</div>overflowযুক্ত করা হয়েছিল) জোর করেছিলাম । overflow: auto;ক্লাস থেকে অপসারণের মাধ্যমে এটি সংশোধন করুন , পাশাপাশি heightনির্বাচক
ফ্লোট সাফ করার একাধিক উপায় রয়েছে। আপনি এখানে কিছু পরীক্ষা করতে পারেন:
http://work.arounds.org/issue/3/cleering-floats/
যেমন, clear:bothআপনার জন্য কাজ করতে পারে
#element:after {
content:"";
clear:both;
display:block;
}
#element { zoom:1; }overflow: auto;উপাদানটি (ফোকাস সজ্জাগুলির মতো) ক্লিপ করবে যা উপাদানটির বাইরে ছড়িয়ে পড়ে, তবে এটি হবে না।
অনেক ক্ষেত্রেই overflow: auto;যথেষ্ট হবে, তবে সমাপ্তি এবং ক্রস ব্রাউজারের সমর্থনের জন্য ক্লিয়ারফিক্সটি দেখুন যা সমস্ত ব্রাউজারগুলির জন্য কাজ করবে।
নিম্নলিখিত মার্কআপ বিবেচনা করা যাক ..
<div class="clearfix">
<div class="content">Content 1</div>
<div class="content">Content 2</div>
</div>নিম্নলিখিত শৈলীর সাথে ..
.content { float:left; }
.clearfix { ..from link.. }
ক্লিয়ারফিক্স divনা থাকলে ভাসমান বাচ্চাদের কারণে পিতামাতার উচ্চতা থাকবে না। ক্লিয়ারফিক্স পিতামাতাকে ভাসমান বাচ্চাদের বিবেচনা করবে।
overflow: auto;