私はスケルトンに不慣れで、簡単なサイトを動かそうとしていますが、Firefoxですでに問題が発生しています。コードは非常に単純です、ここにあります:
<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>
<!-- Basic Page Needs
================================================== -->
<meta charset="utf-8">
<title>Title</title>
<meta name="description" content="">
<meta name="author" content="">
<!-- Mobile Specific Metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- CSS
================================================== -->
<link href="stylesheets/fonts.css" media="all" rel="stylesheet" type="text/css" />
<link href="stylesheets/base.css" media="all" rel="stylesheet" type="text/css" />
<link href="stylesheets/skeleton.css" media="all" rel="stylesheet" type="text/css" />
<link href="stylesheets/layout.css" media="all" rel="stylesheet" type="text/css" />
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Favicons
================================================== -->
<link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico" />
<link rel="icon" type="image/x-con" href="images/favicon.ico" />
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
</head>
<body>
<!-- Primary Page Layout
================================================== -->
<div class="container" style="background-color:#399;"><!-- container START -->
<div class="fifteen columns" style="background-color:#CF0">
ENGLISH
</div>
</div><!-- container END -->
<!-- End Document
================================================== -->
</body>
</html>
列を使用すると、Firefoxを除くすべてのブラウザで正常に表示されます。代わりに、クラスとして「2/3」、または「3/3」を使用すると、問題なく表示されます。
これは、私が列を使用したときにFirefoxが行うことです(写真)(上部102pxに奇妙なスペースを広告します)
「3分の2」を使用すると、Firefoxは再び正常に表示されます(写真)
私はすべてのコードを調べましたが、何が起こっているのか理解できません。なぜ列がFirefoxでうまく機能しないのですか?それが重要な場合、私は17.0.1を使用しています。
助けてくれてありがとう。