css - معنى - خصائص الوسم div




حاوية div المغلفة لعدم الحصول على الارتفاع (4)

أضف العقار التالي:

.c{
    ...
    overflow: hidden;
}

سيؤدي ذلك إلى إجبار الحاوية على احترام ارتفاع جميع العناصر بداخله ، بغض النظر عن العناصر العائمة.
http://jsfiddle.net/gtdfY/3/

تحديث

في الآونة الأخيرة ، كنت أعمل على مشروع يتطلب هذه الحيلة ، ولكن يلزم السماح بتدفق الفائض ، لذلك بدلاً من ذلك ، يمكنك استخدام عنصر زائف لمسح عواماتك ، وتحقيق التأثير نفسه بشكل فعال مع السماح بتجاوز جميع العناصر.

.c:after{
    clear: both;
    content: "";
    display: block;
}

http://jsfiddle.net/gtdfY/368/

أريد أن تحصل حاوية الحاوية على ارتفاع أقصى ارتفاع للأطفال. دون معرفة الطول الذي سيحصل عليه الطفل. كنت أحاول الخروج على JSFiddle . الحاوية div باللون الأحمر. وهو لا يظهر. لماذا ا؟


أنت تحوم الأطفال مما يعني أنها "تطفو" أمام الحاوية. من أجل اتخاذ الارتفاع الصحيح ، يجب عليك "مسح" تعويم

نمط div = "clear: both" يزيل التعويم a يعطي الارتفاع الصحيح للحاوية. انظر http://css.maxdesign.com.au/floatutorial/clear.htm لمزيد من المعلومات عن العوامات.

على سبيل المثال.

<div class="c">
    <div class="l">

    </div>
    <div class="m">
        World
    </div>
    <div style="clear: both" />
</div>

جرب إدراج div clearing قبل آخر </div>

<div style="clear: both; line-height: 0;">&nbsp;</div>


ليس هذا أسهل؟

.c {
    overflow: auto;
}






liquid-layout