0

这是代码：

   <div  style="border-style:solid; border-color:aqua; border-width:1px;">

       <img src="some picture" align="left" /> 
       <div>
            <span >SOME TEXT</span></br>
            <span >SOME TEXT</span></br>
            <span >SOME TEXT</span>
       </div>  

   </div>

跨度块占用的（垂直）空间比图像少，因此边框和图像重叠并且图像部分超出了 div 跨度。这是jsFiddle

如何将边框应用于out div？

4

3 回答 3

3

您应该清除图像和带有跨度的 div<div style="clear:both"></div>最后添加 : 。

<div  style="border-style:solid; border-color:aqua; border-width:3px;">

           <img id="image_HDDimageControl" src="http://stereo-ssc.nascom.nasa.gov/beacon/t0193.jpg" align="left"> 
           <div>
             <span >SOME TEXT</span ></br>
             <span >SOME TEXT</span ></br>
             <span >SOME TEXT</span >
           </div>  

<div style="clear:both"></div>
于 2013-01-14T10:39:31.817 回答
3

添加overflow:auto到第一个 div 样式。

于 2013-01-14T10:43:28.577 回答
2

如果这个http://jsfiddle.net/vleran/aTDYL/8/是你想要做的，而不仅仅是<div style="clear:both;"></div>在外部 div（父 div）的结束标记之前添加。

于 2013-01-14T10:40:17.313 回答