0

以下代码在 Firefox 和 Webkit (Safari/Chrome) 中的工作方式不同，不应如此。据我了解，Firefox 正在正确呈现它。如何使 Webkit 呈现相同的内容？

<!doctype html>
<html>
  <head>
    <style type="text/css">
.frell {
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
}
    </style>
  </head>
  <body>
    <div id="container">
      <button class="frell">Test</button>
    </div>
  <body>
</html>
4

2 回答 2

0

可能继承它的父宽度或获取显示：块。Chrome 开发者工具是怎么说的？我要么指定宽度（% 或 px），要么指定 display:inline（可能是 inline-block）

于 2013-06-27T21:02:34.603 回答
0

Firefox 渲染不正确，webkit 渲染正确。要使 firefox 正常运行，您需要添加width: 100%到该类，即使那样，这也不是在所有情况下都有效，但它会更接近。

绝对定位一个项目并指定左右两侧应该使项目成为填充它们之间的空间的必要宽度。对于一个简单的测试，这里是一个 jsfiddle http://jsfiddle.net/c3EeF/2/，它显示了当您将相同的类应用于按钮和 div 标签时会发生什么。Firefox 在使用该按钮时行为不端，我一直无法找到使其 100% 正常工作的任何设置。

于 2013-06-27T22:28:41.733 回答