這篇文章將為大家詳細(xì)講解有關(guān)DIV層加入margin后的異常怎么辦，小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

創(chuàng)新互聯(lián)公司專注于龍山企業(yè)網(wǎng)站建設(shè),成都響應(yīng)式網(wǎng)站建設(shè)公司,成都商城網(wǎng)站開發(fā)。龍山網(wǎng)站建設(shè)公司,為龍山等地區(qū)提供建站服務(wù)。全流程定制網(wǎng)站開發(fā)，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，創(chuàng)新互聯(lián)公司專業(yè)和態(tài)度為您提供的服務(wù)

DIV層加margin后寬度超過父層自動(dòng)換行的解決方法

下面看浮動(dòng)層加margin后換行的例子:

比如說有個(gè)DIV寬度為380px，它里面有一個(gè)菜單列表，每個(gè)寬度為60px，margin-right為20px。如果就按照下面的HTML結(jié)構(gòu)來做的話，那么這個(gè)菜單列表能在這個(gè)DIV里一行顯示完整嗎？

 
winhd1
 
winhd2
 
winhd3
 
winhd4
 
winhd5
 

5個(gè)菜單，每個(gè)寬度為60px，右邊外補(bǔ)白為20px，因此每個(gè)菜單整體寬度是80px，5個(gè)菜單總長(zhǎng)度為400px，而父級(jí)層寬度只有380px，根據(jù)浮動(dòng)的原理，那么第5個(gè)菜單將毫無疑問的被擠下去即換行了。

◆看下面的解決方法:

代碼如下:

  
winhd1
 
winhd2
 
winhd3
 
winhd4
 
winhd5