0
A
回答
3
我已經更新了你的JS提琴,使用的代碼如下
.header {
width:550px;
margin:20px auto 20px auto;
}
.header:after{
content: '';
clear: both;
display: block;
}
當以往任何時候都使用的是浮動的容器,你應該總是使用clearfix
1
它打破的原因是因爲在CSS您的標題中的元素是浮動的左側和右側。如果所有元素都是浮動的左/右父容器(在這種情況下,標題)將摺疊到0px
或元素的高度而不是浮動;有很多方法可以解決這個問題。
我更喜歡以下 - 可重複使用的方式。
創建一個類「clearfix」,您可以在具有浮動子元素的元素上重複使用該類。
.clearfix:before,
.clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.wrapper {
margin-top: 20px;
}
的 「clearfix」 類添加到Header元素,瞧!元素將「自我清楚」。
例如:
<div class="header clearfix">
<div class="left">
<img src="" width="240px" />
</div>
<div class="right">
<h1>Control Panel</h1>
</div>
</div>
<div class="wrapper">
<div class="container">
<h1 class="login_text"></h1>
<form>...</form>
</div>
</div>
0
unclose浮動元件的這種原因。 您可以添加CSS像這樣
.clear {clear:both;} .header {margin-bottom:20px;}
和你親密的div標籤後立即添加<div class="clear"></div>
"right"
我是更新您的提琴
相關問題
- 1. 將div上移20px - 但保留邊框
- 2. CSS表格單元格邊距,間距
- 3. IE7 CSS格邊距問題
- 4. 如何消除div邊框的邊距
- 5. Bizzare行爲與CSS邊距
- 6. CSS邊距%'s
- 7. CSS邊距
- 8. 如何讓我的div的邊距不可點擊?
- 9. 如何讓div從其他div上升?
- 10. 帶有上邊距的CSS邊距自動居中 - VALID?
- 11. 如何擴展div來補償去除邊界div的邊距?
- 12. 僅限於CSS表格邊框間距
- 13. CSS表單元格邊距弄亂
- 14. CSS高度:20px + padding-bottom:3px = 20px?
- 15. CSS div邊距自動,無法在創建邊距中的位置元素
- 16. 如何讓div停留在另一個div的邊上?
- 17. 如何調整css頁邊距?
- 18. 如何申請邊框間距與CSS
- 19. div內的上邊距不起作用?
- 20. DIV的上邊距不起作用?
- 21. 選擇,提交元素有20px右邊距
- 22. 爲什麼Compass CSS Blueprint有右邊距?
- 23. 如何增加每幅圖像上邊距和邊距
- 24. 使頂部邊距div與其上面的div忽略div
- 25. 如何強制元素上的HTML/CSS填充/邊距?
- 26. JQuery可拖動的DIV以負邊距爲中心...問題
- 27. Offseting格邊距它
- 28. UITableViewController上邊距
- 29. CSS:合併Div和表格邊框
- 30. angular2如何讓一個div出現旁邊單擊陸續格
尼斯輕鬆修復+1 –