Mozilla Firefox上没有加载HTML元素

时间:2014-04-21 17:24:48

标签: javascript jquery html css firefox

页面正在Chrome中正确加载所有内容,但在Firefox中没有。任何人都可以告诉我这是什么问题,我怎么能摆脱它?

在chrome和firefox上检查Link

Chrome: enter image description here

火狐:

enter image description here

HTML:

<div class="container archo-all-projects-container">
<div class="row ">
    <div class="col-lg-12">
        <h4 class="archo-all-projects-header">All Projects</h4>
    </div>
</div>
<div class="argo-project-list">

    <div class="row"><div class="col-lg-12"><h5 class="archo-project-type-header">Architecture</h5></div></div>
    <div class="row">

        <div class="col-lg-3 ">
            <div class="archo-project-item">

                <div class="archo-project-item-title">
                    <a href="project.html"><h5>Project Title</h5></a>
                </div>
                <div class="archo-project-item-image">
                    <a href="project.html"><img src="asset/images/project-thumnail/1.jpg"/></a>
                </div>
            </div>

        </div>


        <div class="col-lg-3 ">
            <div class="archo-project-item">

                <div class="archo-project-item-title">
                    <a href="project.html"><h5>Project Title</h5></a>
                </div>
                <div class="archo-project-item-image">
                    <a href="project.html"><img src="asset/images/project-thumnail/1.jpg"/></a>
                </div>
            </div>

        </div>

        <div class="col-lg-3 ">
            <div class="archo-project-item">

                <div class="archo-project-item-title">
                    <a href="project.html"><h5>Project Title</h5></a>
                </div>
                <div class="archo-project-item-image">
                    <a href="project.html"><img src="asset/images/project-thumnail/1.jpg"/></a>
                </div>
            </div>

        </div>

        <div class="col-lg-3 ">
            <div class="archo-project-item">

                <div class="archo-project-item-title">
                    <a href="project.html"><h5>Project Title</h5></a>
                </div>
                <div class="archo-project-item-image">
                    <a href="project.html"><img src="asset/images/project-thumnail/1.jpg"/></a>
                </div>
            </div>

        </div>
    </div>

</div>
</div>

CSS:

 .archo-project-type-header{
    background: #000;
    color: #fff;
    opacity: .8;
    padding: 15px;
}
.archo-all-projects-container>.argo-project-list>.row{


}
.archo-all-projects-container .argo-project-list{
    overflow-y: auto;
    overflow-x: hidden;
}

.archo-all-projects-container .archo-all-projects-header{
    background: #fff;
    opacity: .8;
    padding: 15px;
}
.archo-all-projects-container .archo-project-item{
    background: #2b2b2b;
    margin-bottom: 15px;


}


.archo-all-projects-container .archo-project-item-image{
    text-align: center;
    padding: 10px;
}
.archo-all-projects-container .archo-project-item-title{
    text-align: center;
    padding: 10px 0 0 0;
}

.archo-all-projects-container .archo-project-item-image a,.archo-all-projects-container .archo-project-item-title a{
    text-decoration: none;
    color: #fff;
}
.archo-all-projects-container .archo-project-item-image a:hover,.archo-all-projects-container .archo-project-item-title a:hover{
    text-decoration: none;
    color: #fff;
}






.archo-all-projects-container .archo-all-project-title{
    background: #000;
}



.archo-project-item .archo-project-item-title{
    color:#fff;
}



/*testing down*/
.archo-all-projects-container {

    /*background: #fff;*/
    bottom: 168px;
    width: 100%;
    top: 75px;
    position: absolute;


}

Fiddle在chrome和firefox中都显示正确

3 个答案:

答案 0 :(得分:0)

问题在于javascript。使用Firefox,我禁用了javascript(使用Web Developer工具栏)并刷新了页面。元素并没有消失。

逐一禁用您的JavaScript,直到它工作,然后您知道违规文件是什么,并且可以使用备用解决方案或修复它。

答案 1 :(得分:0)

您有一个javascript插件,将height:0添加到.slimScrollDiv div。

答案 2 :(得分:0)

在你的代码$(&#39; body&#39;)中,outerHeight()的结果为0.这是因为你使用了元素的绝对定位。执行此操作时,body元素将始终具有0px高度,因为它不包含任何将扩展其高度的元素。 您可以尝试在body元素上设置宽度:100%。它应该工作。