-2

以下のリンクのコードは、jsfiddle では正常に動作しますが、残念ながら float: leftt は chrome/firefox では動作しません。この方向の指針は役に立ちます。

jsfiddle リンク 

<div class='list' id='list1' style='padding: 1px; border : 5px groove; min-width: 3px; width: auto; min-height: 3px; height: auto; ' >
    <div class='tuple tuple1' id='tuple1_1' style='padding: 2px; border : 1px solid; min-width: 3px; width: auto; min-height: 3px; height: auto;' >
        <div class='elmnt elmnt1 elmnt1_1' id='elmnt1_1' style='padding: 2px; border : 1px dotted; position: relative; left: 6px;  min-width: 3px; width: 100; min-height: 3px; height: auto;' >
            <div class='list' id='list2' style='padding: 1px; border : 5px groove; min-width: 3px; width: auto; min-height: 3px; height: auto; ' >
                <div class='tuple tuple2' id='tuple2_1' style='padding: 2px; border : 1px solid; min-width: 3px; width: auto; min-height: 3px; height: auto; overflow: hidden;' >
                    <div class='elmnt elmnt2 elmnt2_1' id='elmnt2_1' style='padding: 2px; border : 1px dotted; min-width: 3px; width: auto; min-height: 3px; height: auto; float : left;' >jdk-7u11-linux-i586.rpm</div>
                    <div class='elmnt elmnt2 elmnt2_2' id='elmnt2_2' style='padding: 2px; border : 1px dotted; min-width: 3px; width: auto; min-height: 3px; height: auto; float : left;' >107M </div>                  
                </div>
            </div>
        </div>
    </div>
</div>
4

1 に答える 1

1

動作の違いは、DOCTYPE があるかどうかによるものです。次のように、先頭に DOCTYPE を含む完全な html ファイルを作成する場合:

<!DOCTYPE html>

その後、期待どおりに動作するはずです。

HTML5 仕様からの引用:

従来の理由から DOCTYPE が必要です。省略した場合、ブラウザーは一部の仕様と互換性のない別のレンダリング モードを使用する傾向があります。ドキュメントに DOCTYPE を含めることで、ブラウザは関連する仕様に従うために最善を尽くそうとします。

于 2013-06-03T20:39:15.057 に答える