div+css 左右两列自适应高度 ,以及父级div也跟着自适应子级的高度(兼容各大浏览器)

<style type="text/css" media="screen">

<!--

#main {width:500px;_height:300px;min-height:300px; background:#aaffaa; border:1px solid #600; float:left;overflow:hidden;_overflow:visible;}

#sidebar {width:200px;background-color:#ff0000; float:left;  border:1px solid #060; }

#content {width:200px; background:#0000ff;  border:1px solid #006; float:left;}

.row{margin-bottom:-10000px;padding-bottom:10000px;}

-->

</style>

</head>

<body>

<div id="main">

    <div id="sidebar" class="row">

         <p>Layer - left</p>

    </div>

    <div id="content"  class="row">

         Layer - right<br />

          right<br />

       right<br />

       right<br />

       right<br />

       right<br />

       right<br />

       right<br />

       right<br />

       right<br />

       right<br />

       right<br />   

    </div>

</div>

</body>

 

你可能感兴趣的:(div+css)