继上次响应式设计应用，这次带给大家的是前端输出中常用到的弹性化布局——兼容IE6+，FF,GG等主流浏览器。弹性布局的实现方式网上就有多种，但都各有优缺点，不一定适用到我们日常的工作中，今天在这里分享个人习惯用的弹性布局，经多年测试，无兼容问题。

如何即简单，兼容性又稳定的实现我们想要的弹性化效果呢？首先直接来个图看看效果：

输出时，最常见到的就是两列或三列的布局形式居多，可部分或全部弹性，弹性盒子里的内容同时也会自动适应啦；来看看如何实现：

1. .content{overflow:hidden;} 
2. .side{float:left;width:200px;margin-right:-200px;} 
3. .mainContent{margin-left:210px;} 

html,css部分就非常简单，这样即可最简化实现，是不是很方便啦，基于这样的效果，我们可以扩展出更多的弹性形式

常用的几种弹性形式

效果一

效果二

效果三

效果四

效果五

弹性布局应用于响应式网站中效果最佳，仅简单设置下宽度就能自动适应各种屏幕尺寸。

为能更快、更容易制作弹性布局，借鉴SuperSlide，开发了一个JS插件（autoAdapt.js）娱乐娱乐下下，内含demo效果，不同尺寸不同配置等功能正在研讨中……

近期项目都有应用，附下载地址：
jquery.autoAdapt.1.0 demo下载