0

从来没想过我会这么说，但谷歌浏览器相当烦人。

我试图在网页上有一个小画廊，在 Safari 上它显示 100% 正确，所有形状都很紧：

Safari 显示网页

然而，在谷歌浏览器上加载同一页面时，它非常偏离中心。

Chrome 显示网页

但是在我的 iPhone 上使用谷歌浏览器，一切都很好。

这是 javascript 库的 CSS 表部分。

#slideshow {list-style:none; color:#fff}
#slideshow span {display:none}
#wrapper {width:725px; margin:50px auto; display:none}
#wrapper * {margin:0; padding:0}
#fullsize {position:relative; width:720px; height:540px; padding:2px; border:1px solid         #ccc; background:#000}
#information {position:absolute; bottom:0; width:720px; height:0; background:#000;   color:#fff; overflow:hidden; z-index:200; opacity:.7; filter:alpha(opacity=70)}
#information h3 {padding:4px 8px 3px; font-size:14px}
#information p {padding:0 8px 8px}
#image {width:720px}
#image img {position:absolute; z-index:25; width:auto}
.imgnav {position:absolute; width:25%; height:306px; cursor:pointer; z-index:150}
#imgprev {left:0; background:url(gallery/images/left.gif) left center no-repeat}
#imgnext {right:0; background:url(gallery/images/right.gif) right center no-repeat}
#imglink {position:absolute; height:306px; width:100%; z-index:100; opacity:.4;   filter:alpha(opacity=40)}
.linkhover {background:url(images/link.gif) center center no-repeat}
#thumbnails {margin-top:15px}
#slideleft {float:left; width:20px; height:81px; background:url(gallery/images/scroll-  left.gif) center center no-repeat; background-color:#222}
#slideleft:hover {background-color:#333}
#slideright {float:right; width:20px; height:81px; background:#222     url(gallery/images/scroll-right.gif) center center no-repeat}
#slideright:hover {background-color:#333}
#slidearea {float:left; position:relative; width:675px; margin-left:5px; height:81px;  overflow:hidden}
#slider {position:absolute; left:0; height:81px}
#slider img {cursor:pointer; border:1px solid #666; padding:2px}

我在 iMac 上查看这个网站，但在 Windows 上使用 Firefox 时它也偏离了中心，所以我可以在 CSS 表中重新格式化以跨浏览器工作吗？

先谢谢了。卢克

4

2 回答 2

0

我建议使用reset.css样式表让浏览器以同样的方式看到它。

在链接到您自己的样式表之前先链接到该样式表，这可能会进行一些更改，但是您可以尝试使用它，然后它应该在所有浏览器中看起来都一样。

还有一个好方法是检查浏览器是否支持您正在使用的 css。

于 2013-04-25T08:28:54.507 回答
0

谢谢大家的回复。我会发布实时链接，但它还没有在本地发布。

但是我已经解决了这个问题。

对于任何看到这一点并需要帮助的人来说，这里是这一行：

#image img {position:absolute; z-index:25; width:auto}

添加左：0; 顶部：0；to line 告诉 img 排队到父 div 的角落

所以现在这条线

#image img {position:absolute; left:0; top:0; z-index:25; width:auto}

再次感谢大家。

于 2013-04-25T08:40:32.997 回答