html – 表中的响应图像(引导3)

我正在使用Bootstrap 3框架,并有一些麻烦
Firefox中的“img-responsive”类.
我有一个4列的表与15/50/10/25％布局.
在第一列是一个大图像,应该缩小到15％.
但这只适用于Chrome / Opera,但不适用于FF / IE(图像不响应,因此太大).

我的代码：

<table class="table table-striped table-condensed voc_list ">

<thead>
<tr>
<th style="width:15%;"></th>
<th style="width:50%;">Bezeichnung</th>
<th style="width:10%;">Zeitraum</th>
<th style="width:25%;">Ort</th>
</tr>
</thead>

<tbody>

<tr class="listview">
<td style="padding:15px 0px 15px 0px;"> 
<a href="xy" title="">
<img src="yx.jpg" class="img-responsive voc_list_preview_img" alt="" title=""></a>
</td>

<td style="width: 50%; padding:15px 15px 15px 15px;">
<a href="xy" title="">
<h3 class="nomargin_top">ABC</h3>
</a>
</td>

<td style="width:10%;">
555
</td>

<td>
XYZ
</td>

</tbody>

</table>

这是BS3中的已知问题吗？我找不到任何东西

编辑：http://jsfiddle.net/cctyb/ – 在Chrome它的工作,在FF的形象是大的

解决方法

添加.img-responsive {width：100％;}到你的css,另请参见： Why do Firefox and Opera ignore max-width inside of display: table-cell?

原文地址：https://www.jb51.cc/html/231120.html