css - 定位在 Firefox 的 Bootstrap 下拉元素中

Question

我正在尝试在下拉元素（也是 Bootstrap）中放置一个 Bootstrap 关闭按钮。

  <div id="contextmenu" class="dropdown clearfix" style="position: absolute;">
    <ul class="dropdown-menu" style="display: block;">
      <li><a href="#">Text <button type="button" class="close">&times;</button></a></li>
    </ul>
  </div>

那东西浮动正确，但在 Firefox 中显示错误（第一个屏幕截图）。Chrome 按预期呈现（第二个屏幕截图）。

有什么方法可以让 Firefox 正确呈现它（即像 Chrome 那样）？

Answer 1

如果没有关于 CSS 的更多上下文，很难知道，但一种解决方案可能是检查 'x' 的位置是否绝对相对于您的 contains 定位<li>。

CSS

.dropdown-menu li {
  ..
  position: relative;
}

.dropdown-menu li .close {
  position: absolute;
  right: 0;
}