CSS - Firefox中滑块的宽度

时间:2013-03-26 03:02:28

标签: css wordpress firefox

我正在修复一个网站。我遇到了我使用的滑块的问题。我使用的滑块是轨道滑块。

这就是事情:

每个幻灯片加载比容器宽度小1个像素,然后在一秒钟后拉伸并最大化其容器的宽度。

我在父容器中的每个div中尝试了宽度:100%,但css规则无法解决我的问题。

所有现代浏览器看起来都很棒,除了firefox。

该网站为http://www.shamarra.co.nz/test/

问:如何在每个幻灯片的初始状态填充宽度,使其符合FIREFOX中的标准滑块输出。

我怀疑滑块需要css修改来解决这个问题。

enter image description here

2 个答案:

答案 0 :(得分:1)

这似乎是FireFox 10+的一个错误。它有多个错误报告。

报告1: https://bugzilla.mozilla.org/show_bug.cgi?id=745549

报告2: https://bugzilla.mozilla.org/show_bug.cgi?id=780521

我不确定是否有修复方法,最后我读到他们没有找到这个错误。

答案 1 :(得分:1)

只需尝试使用以下内容:

在您的css文件中:http://www.shamarra.co.nz/wp-content/plugins/wp-orbit-slider/css/default.css

删除/隐藏以下行并在Firefox中刷新/清除浏览器缓存。

#orbit-inside img.orbit-slide {
    /*height: auto;
    max-width: 100% !important;
    width: 100% !important;*/
}

此外,

    div.orbit > img {
        /*left: 0;*/
        position: absolute;
        top: 0;
    }

    div.orbit > img, div.orbit > a {
        display: none;
        height: 100%;
        /*left: 0;*/
        position: absolute;
        top: 0;
        /*width: 100%;*/
    }

然后它将开始完美运作。我在我的本地服务器上测试过它工作正常。

我认为这可以帮助您解决问题。