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:absolute用于放置 div，请确保 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 回答