margin-top無效的解決方法

先上代碼：

        <div id="content" style=" width:750px; height:300px; background:#C29A29; margin-top:100px; margin-left:150px;">
            <ul class="clearfloat" style="border-top:#630 solid 2px; border-bottom:#630 solid 2px; padding:2px 0 2px 0; margin-top:10px;">
                <li class="contentNav" ><a href="">我是張三</a></li>
                <li class="contentNav" ><a href="">我是李四</a></li>
                <li class="contentNav" ><a href="">那我只能是王五了</a></li>
            </ul>
        </div>

要實現的效果是一個大概居中的div裏面一排導航，給ul的margin-top不論怎麼設置都是無效，百度之:

　　兩個或多個毗鄰的普通流中的塊元素垂直方向上的 margin 會摺疊
　　1.兩個或多個
　　說明其數量必須是大於一個，又說明，摺疊是元素與元素間相互的行爲，不存在 A 和 B 摺疊，B 沒有和 A 摺疊的現象。
　　2.毗鄰
　　是指沒有被非空內容、padding、border 或 clear 分隔開，說明其位置關係。
　　注意一點，在沒有被分隔開的狀況下，一個元素的 margin-top 會和它普通流中的第一個子元素(非浮動元素等)的 margin-top 相鄰； 只有在一個元素的 height 是 "auto" 的狀況　　　　下，它的 margin-bottom 纔會和它普通流中的最後一個子元素(非浮動元素等)的 margin-bottom 相鄰。
　　3.垂直方向
　　是指具體的方位，只有垂直方向的 margin 纔會摺疊，也就是說，水平方向的 margin 不會發生摺疊的現象。

 

這裏感謝前端攻城獅丁小倪在那啥上的回答，不過本人不認識他，估計也@不到，就算了。

　　解決方法：

　　茴香豆有幾種寫法忘了，這個聽說有四種方法，曉得一種就行，其餘的可能會坑。　　

　　給父級元素加：overflow:hidden