Html 带边框的div中的图像和文本

代码如下：

   <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>

一些文本

一些文本

一些文本

span块比image占用更少的（垂直）空间，因此边界和图像重叠，并且图像部分超出div span。这是

---

如何将边框应用于out div？

您应该清除图像和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>

一些文本

一些文本

一些文本

如果这是您尝试执行的操作，而不仅仅是在外部div（父div）的结束标记之前添加

将

溢出：auto

添加到第一个div样式