1

私は次のDOM構造を持っています:

<li>
    <div id="some_id_1">-some html-</div>
</li>

には<li>背景として画像があり、 は<div>の右上隅にコントロール ボックスとして表示されます<li>。

が右に浮かび、<div>右に表示されるはずです。

ページを (Chrome で) 更新する<div>と、 が中央近くに表示され<li>ます (左の画像を参照)。

Chrome の開発者ツールを開き、不透明度 (またはその他の css プロパティ) を変更する<div>と、右に移動します (右の画像を参照)。

Chrome のキャッシュをクリアしようとしましたが、うまくいきませんでした。

これを引き起こしている可能性のある Chrome 固有の問題はありますか? (このページは Firefox で正常に動作します。)

ここに画像の説明を入力 スクリーンショット

CSS:

li {
 position:relative;
}
div {
 position:absolute;
 width:40px;
 float:right;
 margin:0px;
}

(他のすべてのプロパティはフォント/色に関連しています)

更新: margin-right:0px は問題を修正したようですが、不透明度を変更すると div が移動した理由はまだわかりません。

4

2 に答える 2

1

やってみましたmargin-right:0px;

あなたがfloat:right;tryを使用している場合：clear:both; あなたのcssは何ですか？このようにあなたを助けるのは難しいです。

于 2013-04-17T07:42:31.307 に答える
0

position:absolutediv を配置するために使用している場合は、li があることを確認してください。position:relative

li{
    list-style:none;
    position:relative;
    display:inline-block;

}
div{
    position:absolute;
    right:0;
    width:40px;
    background:#333; 
    color:white;
    border-radius:4px
}

デモ

于 2013-04-17T07:39:43.150 に答える