CSS错误在Safari但不是Chrome浏览器/火狐

Question

https://gist.github.com/2354116

如果您在Chrome/Firefox访问上面的页面，然后似乎一切都很好。底部的div（两个标题和社交图标）被包装在容器div和中心中，没有问题。

如果在Safari的浏览尽管然后这三个div的并非在所有中心：/

我不知道这是为什么....谁能帮助？

Answer 1

注意：必须承担很多与您的设计，所以修改任何不符合您的原始设计。

首先，你没有正确地包含你的页面元素（内容，传送带，页脚），你目前有多个宽度容器试图并排居住，这是在多个地方打破你的设计。

您的内容容器是width:940px，你.wrapper DIV是width:750px，你.paramWrapper DIV是width:870px，你.carousel DIV是width:735px。您必须选择一个宽度并坚持使用，并使用保证金在您的页面上相应地推送内容。我使用860px，这是span11类的宽度。

接下来，您直接修改bootstrap.css样式表，这意味着每当引导得到更新时，如果覆盖引导样式表，则所有更改都将丢失，因此请创建另一个样式表并将所有自定义样式放在那里只需在标题中的引导样式表之后加载它即可。

现在到你原来的问题，底部.paraWrapper DIV没有正确堆叠因为你有870px组的宽度在容器内的元素加起来也不到宽：

span3 + span3 + span2 + margin = 640px

所以这不是问题或错误，它只是你的布局。

这是一个固定的版本，我很快就提出了，所以你将不得不修改元素以再次适合你的设计：http://jsfiddle.net/rzSFa/3/，这里是它的外观demo。

顺便说一下，你使用响应式引导样式表为零，它目前没有在你的情况下做太多，所以为什么要使用它呢？虽然你可以很容易地修改一些媒体查询来支持我的固定版本，但是你根本无法工作，因为你用自定义宽度声明了所有你自己的类，所以没有必要包含它。