سوال: مشکل در نمایش سایت در فایرفاکس [بایگانی]

Iran58

پنج شنبه 28 اسفند 1393, 13:17 عصر

باسلام
من کدهای

<!DOCYYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Html5_16</title>
<link rel="stylesheet" href="main.css"/>
</head>
<body>
<div id="big_wrapper">
<header id="top_hearder">
<h1>Welcome to my website</h1>
</header>
<nav id="top_menu">
<ul>
<li>Home</li>
<li>About</li>
<li>Contact Us</li>
<li>Our Office</li>
</ul>
</nav>
<div id="new_div">
<section id="main_section">
<article>
<header>
<hgroup>
<h1>Tilte of article</h1>
<h2>Subtitle of article</h2>
</hgroup>
</header>
<p>This is the best site ever!</p>
<footer>
<p>-Written by Ab Ra</p>
</footer>
</article>
<article>
<header>
<hgroup>
<h1>Tilte of article</h1>
<h2>Subtitle of article</h2>
</hgroup>
</header>
<p>This is the best site ever!</p>
<footer>
<p>-Written by Ab Ra</p>
</footer>
</article>
</section>
<aside id="side_news">
<h4>Recent News</h4>
</aside>
</div>

<footer id="the_footer">
CopyRigth 2015 all right reserved.
</footer>
</div>
</body>
</html>
و
*{
margin:0;
padding:0;
}
h1{
font:bold 20px Tahoma;
}
h2{
font:bold 14px Tahoma;
}
header,section,footer,aside,nav,article{
display: block;
}
body{
width: 100%;
display: -webkit-box;
-webkit-box-pack:center;
display: -moz-box;
-moz-box-pack:center;
-o-box-pack:center;
-ms-box-pack:center;
}
#big_wrapper{
max-width: 1000px;
margin: 20px 0;
display: -webkit-box;
-webkit-box-orient:vertical;
-webkit-box-flex:1;
display: -moz-box;
-moz-box-orient:vertical;
-moz-box-flex:1;
-o-box-orient:vertical;
-o-box-flex:1;
-ms-box-orient:vertical;
-ms-box-flex:1;
}
#top_hearder{
background: yellow;
border: 3px solid black;
padding: 20px;
}
#top_menu{
border:red;
background: blue;
color: white;
}
#top_menu li{
display: inline-block;
list-style: none;
padding: 5px;
margin:5px;
font: bold 14px tahoma;
}
#new_div{
display: -webkit-box;
-webkit-box-orient:horizontal;
-moz-box-orient:horizontal;
-o-box-orient:horizontal;
-ms-box-orient:horizontal;
}
#main_section{
border:1px solid blue;
-webkit-box-flex:1;
-moz-box-flex: 1;
-o-box-flex: 1;
-ms-box-flex: 1;
margin: 20px;
padding: 20px;
}
#side_news{
border:1px solid red;
width: 220px;
margin: 20px 0;
padding: 30px;
background: #66cccc;
}
#the_footer{
text-align: center;
padding: 20px;
border-top: 2px solid green;
}
اما هنگام اجرا در کروم درست نمایش می دهد ولی در فایرفاکس مانند کروم نیست اشکال کد من کجاست
باسپاس