关于高度自适应

<div class="noin">
	<div class="noin1"  style="height:100px;width:100px;border:1px solid #000;float：left">
		dsd
	</div>
	<div class="noin1"  style="height:100px;width:100px;border:1px solid #000;float:right;display:inline-block">
		dsd	
	</div>
</div> 

这样可以的结果是noin的div高度为0 了，仔细思考一下，为什么它的高度会是0呢？不是应该高度自适应吗?他的高度应该是被里面的元素撑大的啊。

原来是这个原因，noin1的两个div分别用到了float属性，这个属性导致它们脱离了文档流，不在noin这个div里面了，所以noin就里相当于没有元素，也就没有了高度，以前的方法是

<div class="noin">
	<div class="noin1"  style="height:100px;width:100px;border:1px solid #000;float：left">
		dsd
	</div>
	<div class="noin1"  style="height:100px;width:100px;border:1px solid #000;float:right;display:inline-block">
		dsd	
	</div>
<br style="clear:botn"/>
</div>

清楚浮动后就可以高度自适应了，但是这样的缺点是多了个无意义的标签

我觉得可以这样改一下会不会好一点，希望多提意见

<div class="noin">
	<div class="noin1"  style="height:100px;width:100px;border:1px solid #000;display:inline-block">
		dsd
	</div>
	<div class="noin1"  style="height:100px;width:100px;border:1px solid #000;float:right;display:inline-block">
		dsd	
	</div>
</div>

这样也可以实现相同的效果，但是也有缺点就是，display:inline-block不支持IE6和IE7，确实有点蛋疼，但是真的不想再做兼容ie6,7的网站了