記的之前 evenwu 為了找尋外包 CSS 人才,出了一份考題,有提供上機考,真是佛心來的,還給用 Inspector 或上網。其中一題就是
第二題、如果一個X元素內的子元素通通 float: left 請問X元素本身會有什麼狀況?如果我要在X元素內下背景,卻沒有顯示,請問如何解決?
解決方式就是實作本身 clear-fix,或者是在元素後加上 clear: both 的標籤,大概就是底下的樣子
如果是要在 container 實作 clear-fix,就必須透過 css before after。
.clear:before, .clear:after {
content: "";
display: table;
}
.clear:after {
clear: both;
}
content: "";
display: table;
}
.clear:after {
clear: both;
}
這樣只要在任何 element 加上 clear css 就可以了