溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章將為大家詳細講解有關DIV層加入margin后的異常怎么辦，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
DIV層加margin后寬度超過父層自動換行的解決方法
下面看浮動層加margin后換行的例子:
比如說有個DIV寬度為380px，它里面有一個菜單列表，每個寬度為60px，margin-right為20px。如果就按照下面的HTML結構來做的話，那么這個菜單列表能在這個DIV里一行顯示完整嗎？
<DIV> <DIV>winhd1</DIV> <DIV>winhd2</DIV> <DIV>winhd3</DIV> <DIV>winhd4</DIV> <DIV>winhd5</DIV> </DIV>
5個菜單，每個寬度為60px，右邊外補白為20px，因此每個菜單整體寬度是80px，5個菜單總長度為400px，而父級層寬度只有380px，根據浮動的原理，那么第5個菜單將毫無疑問的被擠下去即換行了。
◆看下面的解決方法:
代碼如下:
<DIV> <DIVclassDIVclass="overflowDIV"> <DIV>winhd1</DIV> <DIV>winhd2</DIV> <DIV>winhd3</DIV> <DIV>winhd4</DIV> <DIV>winhd5</DIV> </DIV> </DIV>
父級層寬度380px，遮罩層overflowDIV寬度設置為菜單需要的400px,overflow為hidden。因此，很自然的，遮罩層多出的20像素部分則不會顯示出來。而菜單就在這400px的寬度里為所欲為了。
關于“DIV層加入margin后的異常怎么辦”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
