如何在浮動元素下面開始新的部分

Question

<div style="background-color:black; margin-top:0px"> 
    <a href="http://csc2.madonna.edu/~brabahy/hw5/mercury2.html"><img src="http://csc2.madonna.edu/~brabahy/hw5/images/Mercury1.jpg" style="float:left; margin-right:10px" height="400" width="400"></a> 
    <p style="color:brown">Mercury is the smallest planet, and it's closest to the Sun of the eight planets in the Solar System. It has an orbital period of about 88 Earth days.</p> 
</div> 

我試圖在浮動圖像下面開始一個新的元素（另一個包含浮動圖像和文本 - 與現有img和文本相同的div），而不是形象的權利。但我無法弄清楚該做什麼！

Answer 1

您需要將clear: left; css樣式添加到第二個div。 的清除是如何工作的一些更多的信息，請訪問：https://developer.mozilla.org/en-US/docs/Web/CSS/clear

http://codepen.io/anon/pen/YXYgKo