CSS给出了mozilla和chrome的不同外观

Question

费率框的CS：

 .rating-input {
     font-size: 25px;
     position:relative;
     left:101%;
 }

按钮：

 .custom-input-button {
     text-align: center;
     position:absolute;
     left:64.4%;
     top:12.1%;
 }

图片：

 <img src="https://graph.facebook.com/<?php echo $user_id; ?>/picture?type=large"
      style ="position:relative; top:-46px; left:0px;"/>

它在chrome和firefox中提供了不同的外观：

火狐：

在Chrome书签菜单中未打开。间距的变化是由于这个原因造成的？ 我很沮丧地改变立场，但问题没有解决。

Answer 1

我同意你没有给我们足够的代码来真正给你一个很好的回应。

如果这有帮助的话，当我这样做自定义表格框时，我将它们包装在div中以开始。然后定义我的宽度/高度，并做左浮动。这可能是一种弃用的方法，可能有更好的方法，但这对我来说一直很有用，所以我仍然倾向于这样做。

这应该保持你的元素全部位于顶部，然后你可以做一个明确的：两者，并将你的评级系统浮动到右边？只是一个想法。

Answer 2

将z-index:-999;添加到图片中，使其不会位于绿色横幅

前面

Answer 3

只是在评论中总结对话。

您可以制作宽度为％的可调整大小的容器。这将使您的网站可调整到屏幕分辨率。使它的最小分辨率为15“显示（宽度为1024px）。然后将元素放在这些容器中。你可以将它们包装在另一个包装节点中。更多的包装div - 越少可能出错。但你也不想要它们很多，当然。这取决于您网站的结构。然后您可以在这些容器内的px中设置元素的边距和大小。

上段喋喋不休的简单例子

jsfiddle.net/Driveash/qgbLB 您还可以为特定浏览器制作额外的CSS。

左边和边距是否相同？

左边和左边边可以做同样的事情，但它们不一样。左边是定位元素（绝对，相对，固定）。如果你没有定位元素，那么你想使用margin-left。