1

私はスケルトンに不慣れで、簡単なサイトを動かそうとしていますが、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を使用しています。

助けてくれてありがとう。

4

1 に答える 1

1

どういうわけか、Firefoxでは「clear:both」がうまく機能しないことがわかりました。だから私は追加しなければなりませんでした:コンテナdivにclarfix。

今働いています!

于 2012-12-31T20:25:35.743 に答える