网站布局与localhost上显示的不同

Question

我有一个网站，在网址上的显示方式与本地主机不同，它在本地主机上完美显示但是当我在实际网址上运行时，它会向上移动，并且轮播通过导航面板。我已经尝试了几乎所有我能想到的东西。

网址为：http://www.cricketsaskatoon.com

Answer 1

检查你的css是否有.navbar-wrapper或carousel.php第17行。在那里，只需删除以下代码：

position: absolute;

如果删除它，它在Firefox上显示我完全没问题。

Answer 2

从navbar-wrapper类中删除位置

.navbar-wrapper {
    top: 0;
    right: 0;
    left: 0;
    z-index: 20;
}

使用上面的css代替它。它可能会对你有帮助。

同时从carousal Div中删除margin-top:-80px;。

Answer 3

你真的应该放置更多代码。

从您网站的源代码中，您的轮播似乎被放置在特定的div类中：

$('ul').each(function(index, elem) {
    for (var i = 2; i < 10; i++) {
        (function(image) {

             image.onload = function() { // image loaded successfully
                 $(elem).append( $('<li />').append(image) );
             }

             image.src = $(elem).find('img').attr('src').replace(/\d/, i);
        })(new Image());
    }
});

更改div样式。或者更确切地说，只需要设置边距80而不是-80。这应该有用。

<div style="margin-top:-80px;"> <!-- Carousel ================================================== --> <div id="myCarousel" class="carousel slide" data-ride="carousel">

Image with the changed style`

使用容器标签也应该有帮助。