Question

这是一个奇怪的问题。我正在localhost中构建一个新的布局。布局在本地服务器中看起来很正常;没有错误，没有浮出父框。

但是当我把它放在现场/现场服务器上时，布局突然中断了。侧边栏浮动到父框之外，还有一些功能不起作用。

以下是一些截图：

正常布局（在localhost上查看时）：

http://i.imgur.com/19rGS.png

布局破损（在实际网站上查看时）：

http://i.imgur.com/rzauG.png（边栏浮出框并移至底部，查看下一个屏幕截图）

http://i.imgur.com/kvX86.png

我检查了两个源代码（在localhost和live site中），奇怪的是两者都完全相似。我真的不知道为什么会这样。有帮助吗？另外需要注意的是，该网站正在使用Wordpress进行CMS。

Answer 1

帖子页面和主页之间的布局不一样。例如，在您的主页上，#primary是#main的孩子：

<div id="main"> 
    <div id="container">
    </div><!-- #container -->

    <div id="primary" class="widget-area">
    </div><!-- #primary .widget-area -->

    <div id="secondary" class="widget-area">
    </div><!-- #secondary .widget-area -->
</div>

然而，在您的帖子页面上，#primary 不是#main的孩子，从而打破了您的CSS并将侧边栏推离页面：

<div id="main"> 
    <div id="container">
    </div><!-- #container -->
</div><!-- #main -->

    <div id="primary" class="widget-area">
    </div><!-- #primary .widget-area -->


    <div id="secondary" class="widget-area">
    </div><!-- #secondary .widget-area -->

我希望这会有所帮助。

Answer 2

请注意，在生产模式下可能会出现缓存加载等问题... 这意味着每当您尝试上传新内容时，主机都可能会呈现该文件的旧版本。

例如，如果您将网站上传到主机并且您有一个css：

的style.css

你希望改变一些事情，你可以这样做：

1.在上传新的css后，请求托管服务重新启动服务器。

或

2.上传相同的文件，但使用其他名称，如stylev1.css

请记住在html的标题中提及它。

这应该可以快速解决问题。

布局在Localhost上看起来不错，但在Live网站上有所突破？

2 个答案: