html - 两个并排的 DIV 在底部提供额外的空间......

Question

我需要将 2 个固定宽度的 DIV 并排放置在另一个大的固定宽度 DIV 中，它正在工作。这是我编写的代码:

<div id="mainDiv">
    <div id="divLeft">      <img src="bla bla bla" >     </div>
    <div id="divRight">   Normal Text Here.....  </div>
</div>

这是 CSS:

#mainDiv { width:1100;overflow:hidden; }

#divLeft { width:720; float:left;}

#divRight { width:380; float:right;}

问题是，当我将尺寸为 720X480 的图像放入第一个 DIV 时，第一个 DIV(“divLeft”)的高度变为 485。为什么要额外提供5 像素？

您可以在此处查看页面:http://www.touchmedia.ca/TestPos.php

请注意以下事项:我为主div b'cos做了overflow:hidden，否则，float会消除外层div的影响。我只硬编码了宽度而不是高度。主div宽度(1100)=左div宽度(720)+右div宽度(380)

非常感谢，

艾萨克

Answer 1

添加:

#divLeft img {
    display: block; 
}