html標籤溢出問題

來源:互聯網
上載者:User

標籤:idt   ges   ima   float   導致   tac   分析   service   .com   

一個巨簡單的坑,記錄一下:
class=index的div沒有padding,margin,但上方迷之懸空。

<head>
<meta charset="UTF-8">
<title>About Us</title>
<style>
* {
font-family: ‘Microsoft YaHei‘;
margin: 0;
padding: 0;
}

.index {
width: 1279px;
margin: 0 auto;
}

.kvb_index_category_top {
height: 33px;
font-size: 18px;
margin: 22px 22px 20px 40px;
}

.kvb_index_category_top > li {
list-style: none;
float: left;
padding: 4px 23px;
}
</style>

</head>
<body>
<div class="index">

<div>
<!--<div style="overflow:hidden;">-->
<ul class="kvb_index_category_top">
<li>Home</li>
<li>|</li>
<li>About us</li>
<li>|</li>
<li>Product and service</li>
<li>|</li>
<li>contact us</li>
<li>|</li>
<li>system login</li>
<li>|</li>
<li>download</li>
</ul>
</div>
</div>
</body>

分析:我把頁面刪的只剩這麼點,容易發現問題.最後發現是div子標籤ul設定的margin導致外部div上方溢出。
把margin設定為padding就不會懸空了,或者把div設定成overflow:hidden

html標籤溢出問題

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.