1

基本的に、reset.less ファイルに由来する img の Twitter Bootstrap 2.2 リセットをリセット (元に戻す) したいと考えています。

Twitter Bootstrap は基本的にこの CSS を設定しています。

img {
  width: auto\9;
  height: auto;
}

これを元に戻すには、この後にどの CSS を追加できますか? 私は実際にbootstrap-sass gemを使用しているので、これに対処する必要があります。

gem ソースの CSS をコメント アウトすると、問題は解決しますが、heroku によって gem が読み込まれると問題が解決しません。したがって、これを修正するには、ローカルのオーバーライド/モンキー パッチが必要です。

ありがとう。ここに問題があります: https://github.com/desandro/isotope/issues/335#issuecomment-11507013とここ: https://github.com/twitter/bootstrap/issues/6541

このパッチがないと問題は、chrome と safari が画像を正しく描画できないため、すばらしいアイソトープ ライブラリが正しく機能しないことです。

4

2 に答える 2

1

この下に新しい複製セレクターを追加できます。

img {
  width: auto;
  height: auto;
}

それはそれを上書きする必要があります。<head>ドキュメントのセクションのメインファイルの下で呼び出される新しいファイルにそれを追加することもできます。

于 2013-01-11T10:31:54.603 に答える
0

ここに答えを投稿しました:https://github.com/twitter/bootstrap/issues/6541

CSS でこれをインライン化すると、次のように機能しました。

<img src="blah-blah" width=398 height=265 style="width:398px; height:265px">

実際、次のように、幅と高さの属性を使用せずに Isotope もテストしました。

<img src="blah-blah" style="width:398px; height:265px">

そして、それはうまくいきました!CSSのみを指定する方が良い場合の推奨事項はありますか?

このCSSを使用することで、ブートストラップ(またはブートストラップ2.0)なしでこれを非常に簡単にテストできました: img { width: auto; 高さ: 自動; }

CSS の幅と高さが画像のプロパティをオーバーライドしているようで、画像が読み込まれる前に、ブラウザは割り当てるスペースの量を認識せず、画像が読み込まれた後でも間隔がまだ間違っています。少なくとも同位体で。スタイルをインライン化すると、問題を回避できます。通常のスタイルを使用しようとしたと思いますが、うまくいかないようでしたが、CSS の優先度の問題があった可能性があります。いずれにせよ、画像のサイズは画像のプロパティでレイアウトされるため、この小さなインライン CSS を挿入するのはかなり自然なことです。これはアップグレード時に他の人に確実に影響を与えるため、最終的にはより良い解決策が見つかることを願っています.

または、少なくとも、プロパティではなく画像の幅と高さにインラインスタイルを使用する必要があることを文書化する必要があります。

于 2013-01-12T08:07:12.553 に答える