css - Twitter Bootstrap で画像の縮小/サイズ変更を無効にするにはどうすればよいですか?

Question

私は次のセットアップを持っています

• ブートストラップ 2.2.1
• AJAX 経由でレイヤーに読み込まれた HTML
• レイヤーはデスクトップ モニターで 600 ピクセルの幅です

小さな画像 (32x32 ピクセル) を表示したい:

<img src="/img/icon_line.png" class="img-polaroid" width="32" height="32" />

何が起こるかというと、bootstrap.css の次の css ルールによって小さなサイズに縮小されます。

img {
  width: auto\9;
  height: auto;
  max-width: 100%;
  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic;
}

これを回避し、レイヤーでアイコンをフルサイズで表示するにはどうすればよいですか?

更新: これは、画像がテーブルにあり、テーブルの行に多くのテキストがあり、すべてがレイヤーにある場合に発生することがわかりました。

これが私のユースケースの簡単な例です：

• 長いテキスト、壊れています: http://www.another-showroom.com/bootstrap/broken.html
• 短いテキスト、OK: http://www.another-showroom.com/bootstrap/ok.html
• zip ファイルの例: http://www.another-showroom.com/bootstrap/bsbug.zip

修正版:

• http://www.another-showroom.com/bootstrap/fixed.html

Answer 1

画像の次のコードを含む表のセルに使用:

<td class="span1">
     <img src="img/icon_line.png" class="img-polaroid" alt="Ligne">
</td>