IMG 和 TD 的 CSS 宽度/高度答案

【问题标题】：CSS width/height of IMG and TDIMG 和 TD 的 CSS 宽度/高度
【发布时间】：2013-07-30 19:33:50
【问题描述】：

我的css有问题，我有一个宽度为：100px的TD；和高度：100px；在其中，我有一个宽度和高度相同的 img 元素（100px，100px）。问题是 TD 自动调整为 145px 宽和 114 px 高。

如果有人知道为什么以及如何解决它，请帮助我！（如果我不需要增加我的TD尺寸就好了，我的图像必须是100*100）这个问题已经解决了，我已经评论了css的那部分。但是我的图像现在放在了 titleTD 和 descTD 中的文本下方。

这是 HTML

<div id="pixelContent">
        <table id="pixelContentTable">
        <tr valign=center>
            <td id="imageTD" rowspan=2>
                <a href=""><img src="" id="contentImage" border="0" width="100px" height="100px"></a></td>
            <td id="titleTd">Title here</td>
        </tr>
        <tr valign=center>
            <td id="descTd">Lorem ipsum dolor sit amet, <a href="http://google.com"> nunc in sapien gravida</a> eleifend. Maecenas consectetur, risus id lobortis molestie, magna sapien ullamcorper justo, ultrices </td>
        </tr>
        </table>
    </div>

还有 CSS：

#pixelContentTable{
margin: 0 auto;
width:400px;
height:120px;
text-align:left;
}

#contentImage{
margin-left:10px;
width:100px;
height:100px;
min-width:100px;
min-height:100px;
max-width:100px;
max-height:100px;
}



  #imageTD{
    width:100px;
    height:100px;
    min-width:100px;
    min-height:100px;
    max-width:100px;
    max-height:100px;
  }

【问题讨论】：

我们能看到你所有的代码吗？
你能提供一个小提琴吗？
小提琴 = jsfiddle.net

标签： html css parsing height width

【解决方案1】：

这样做：

<table>
  <tr>
    <td>
      <img src="" alt />
    </td>
  </tr>
</table>

和 CSS：

img {
  width: 100px;
  height: 100px;
  display: block;
}

td {
  border: 1px solid red;
  width: 100px;
  height: 100px;
  padding: 0;
}

http://codepen.io/Chovanec/pen/otaFb

【讨论】：

显示：块 - 是主要的东西！