Question

我正在开发一个Web应用程序，我已经在每个浏览器中显示了一些div。我的div中没有出现在firefox上。可能的原因是什么。

这是我的fiddle

我已将background-color:black给予未显示的div。

CSS

html, body
{
    height:100%;
    margin:0;
    padding:0;
    overflow:hidden;
}

#main_header
{
    height:20%;
    border-bottom:3px solid grey;
}
#user_info
{
    height:40%;
    width:auto;
    float:right;
    text-align:right;
    position:relative;
    right:3%;
    top:42%;
}
#user_info span
{
    font-size:1.2em;
    font-weight:600;
}
#logo
{
    height:60%;
    width:25%;
    float:left;
    background-image:url('../images/ibuildmart_logo.png');
    background-repeat:no-repeat;
    background-size:100% 100%;
    position:relative;
    left:5%;
    top:20%;
}

#main_wrapper
{
    height:75%;
}
#menu_wrap
{
    width:10%;
    float:left;
    height:100%;
    background-color:yellow;
}
#content_wrap
{
    width:90%%;
    height:100%;
    float:right ;
}
#content
{   
    background-color:black;
    width:95%;
    height:92%;
    border-radius:20px;
    -moz-border-radius:20px;
    margin:2%;
    overflow:auto;
}
#main_footer
{
    height:5%;
    background-color:blue;;
}

HTML

 <div id="main_header">
  <?php
include_once('header.php');
?>
</div>


<div id="main_wrapper">
  <div id="menu_wrap">
  </div>
  <div id="content_wrap">
    <div id="content">

    </div>
  </div>

</div>
<div id="main_footer">

  <?php
include_once('footer.php');
?>
</div>

Answer 1

首先，HTML注释未正确关闭。主要原因是您在ID %中使用了双content_wrap。

以下是 Demo.

#content_wrap
{
    width:90%%; /*you are using double percentage here*/
    height:100%;
    float:right;
}

Answer 2

您有多个问题：

http://jsfiddle.net/uZd3u/2/

您使用--!>关闭了HTML评论，这是错误的。它必须是这样的：

您的content_wrap是float: right;

div没有出现在firefox中

2 个答案: