html - float 和高度之间有什么问题:100% of divs

请参阅下面的 HTML:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        html, body
        {
            padding: 0;
            margin: 0;
            width: 100%;
            height: 100%;
            border: 1px solid red;
        }
        #MainDiv
        {
            width: 100%;
            min-height: 200px;
            height: auto;
            border: 1px solid blue;
        }
        #Contents
        {
            width: 500px;
            margin: 0 auto;
            min-height: 100px;
            height: auto;
            border: 1px solid green;
        }
        #RContents
        {
            float: right;
            width: 200px;
            min-height: 50px;
            height: auto;
            border: 1px solid pink;
        }
        #LContents
        {
            float: right;
            width: 200px;
            min-height: 50px;
            height: auto;
            border: 1px solid yellow;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div id="MainDiv">
        <div id="Contents">
            <div id="RContents">
                Right Contents
            </div>
            <div id="LContents">
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
                Left Contents
                <br />
            </div>
        </div>
    </div>
    </form>
</body>
</html>

这个 JSFiddle 链接:
jsfiddle

在我的示例中，float 和 height:100% 之间有什么问题？

如何强制 body 、 MainDiv 和 Contents div 与 LContents div 一起增长？

min-height 是如此重要

提前致谢

最佳答案

像这样:

http://jsfiddle.net/9TLFM/

我已经使用clear:both清除了 float 并从正文中删除宽度和高度

关于html - float 和高度之间有什么问题:100% of divs，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7890615/

html - float 和高度之间有什么问题:100% of divs

上一篇：html - 满足不同网络设备的最有效方法？

下一篇：html - 在 HTML 代码中使用大量换行符有什么好处吗？