html - Chrome 中有趣的 HTML 行为

Question

我有以下 DOM 结构:

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

<li>有一个图像作为背景，<div>在 <li> 的右上角显示为一个控制框.

<div>向右浮动，应该显示在右侧。

当我刷新页面(在 Chrome 中)时，<div>显示在 <li> 的中间附近(如左图所示)。

当我打开 Chrome 的开发者工具，并更改 <div> 的不透明度(或任何其他 css 属性)时, 它向右移动(如右图所示)。

我尝试清除 Chrome 的缓存，但没有成功。

任何可能导致此问题的 Chrome 特定问题？ (该页面在 Firefox 中运行良好。)

CSS:

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

(所有其他属性与字体/颜色相关)

更新:margin-right:0px 似乎有固定的问题，但我仍然很困惑为什么改变不透明度会移动 div。

Answer 1

你试过margin-right:0px;

如果您正在使用 float:right; 尝试:clear:both;你的CSS是什么？很难以这种方式帮助你。