كيف - مسح العوامات (كليرفيكس)
تعرف على كيفية مسح العوامات باستخدام الاختراق "clearfix".
كيفية مسح العوامات (كليرفيكس)
ستتدفق العناصر بعد العنصر العائم حوله. استخدم الاختراق "clearfix" لإصلاح المشكلة:
بدون كليرفكس
مع كليرفكس
هاك clearfix
إذا كان أحد العناصر أطول من العنصر الذي يحتويه ، وتم تعويمه ، فسوف يفيض خارج الحاوية الخاصة به.
ثم يمكننا أن نضيف overflow: auto;
إلى العنصر المحتوي لإصلاح هذه المشكلة:
مثال
.clearfix {
overflow: auto;
}
The overflow:auto clearfix works well as long as you are able to keep control of your margins and padding (else you might see scrollbars). The new, modern clearfix hack however, is safer to use, and the following code is used for most webpages:
Example
.clearfix::after {
content: "";
clear: both;
display: table;
}
Tip: Learn more about floats in our CSS Float Tutorial.