Jo *_*ina 2 html css height parsing width
我的css有问题,我有一个宽度为100px的TD;和高度:100px;在它里面,我有一个具有相同宽度和高度(100px,100px)的 img 元素。问题是 TD 会自动调整为 145 像素宽度和 114 像素高度。
如果有人知道为什么,以及如何解决它,请帮助我!(如果我不需要增加我的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>
Run Code Online (Sandbox Code Playgroud)
和 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;
}
Run Code Online (Sandbox Code Playgroud)
这样做:
<table>
<tr>
<td>
<img src="" alt />
</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
和 CSS:
img {
width: 100px;
height: 100px;
display: block;
}
td {
border: 1px solid red;
width: 100px;
height: 100px;
padding: 0;
}
Run Code Online (Sandbox Code Playgroud)
http://codepen.io/Chovanec/pen/otaFb
| 归档时间: |
|
| 查看次数: |
9353 次 |
| 最近记录: |