在IE6环境下使用min-width的方法

min-width默认是不被IE6支持的，不清楚IE7的情况，在FF中支持很好，而且这也是一个非常有用的属性。

既然IE6默认不支持，我们肯定就要使用一些技巧来至少表面上看来是支持的。

思路：3个div相对定位嵌套，通过border-left，和margin-left取负值的办法，实现最小宽度为border-left的值。

1，定义此width宽度为90%，min-width为400px；rule为400px的盒子做对比，此时用FF能看到我们的预期效果，在IE下不行：

.width { width:90%; min-width:400px; border:1px solid #aaa;}
.rule { width:400px; background:#c00; border:1px solid #c00; color:#fff; margin:10px 0; text-align:center; padding:5px 0;}

<div class="width">
  内容填充内容填充内容填充内容填充内容填充内容填充内容填充
</div>
<div class="rule">这是400px宽</div>

2，在width内嵌套了一层minwidth，定义border-left为400px，同时相对定位，看到左边框空白的效果，留出我们需要的位置。

.width { width:90%; min-width:400px; border:1px solid #aaa;}
.rule { width:400px; background:#c00; border:1px solid #c00; color:#fff; margin:10px 0; text-align:center; padding:5px 0;}
* html .minwidth { border-left:400px solid #fff; position:relative; float:left; z-index:1;}

<div class="width">
  <div class="minwidth">内容填充内容填充内容填充内容填充内容填充内容填充</div>
</div>
<div class="rule">这是400px宽</div>

3，在minwidth内再嵌套一层container，定义负左边距等于minwidth层的border-left值，同时相对定位，完成效果。

.width { width:90%; min-width:400px; border:1px solid #aaa;}
.rule { width:400px; background:#c00; border:1px solid #c00; color:#fff; margin:10px 0; text-align:center; padding:5px 0;}
* html .minwidth { border-left:400px solid #fff; position:relative; float:left; z-index:1;}
* html .container { margin-left:-400px; position:relative; float:left; z-index:2; padding:3px;}

<div class="width">
  <div class="minwidth">
  <div class="container">
  最内层必须要有内容填充，最内层必须要有内容填充，最内层必须要有内容填充，最内层必须要有内容填充，最内层必须要有内容填充。
  </div>
  </div>
</div>
<div class="rule">这是400px宽</div>

这又是一个负边距例子，我们不难理解：当container宽超过400px时，container右边距和minwidth一样自动延伸；当 container宽不超过400px时，container右边距等于minwidth左边距，也就是说container的宽就是minwidth的 border-left，只不过浮动在上边而已。

提示：* html .minwidth的写法是IE6专用（IE5未知，有兴趣的测试），可以使用其他hack手段。

基本思路而已，如果需要提高兼容性，可在此基础扩展。个人认为实用有限，因为使用了浮动，不过在某些场合表现出来还是蛮神奇的。