如果您想订阅本博客内容，每天自动发到您的邮箱中， 请点这里
弹性布局（Flexbox）确实为我们构建复杂、灵活的布局带来了很大的便利，但是它的兼容性确实让人很头痛，下面是我遇到的一个问题：
理想效果：
IE11效果：
html大概结构：
-
<div class="box">
-
<div class="input-container">
-
<input />
-
<div class="tooltip"></div>
-
</div>
-
<button></button>
-
</div>
这里大致说一下css，input-container宽高没设死，由input决定，并设置position: relative;相对定位，并采用display: flex;弹性布局。tooltip设置绝对定位，通过top调整垂直位置，由input-container的弹性布局属性设置水平居中（是不是觉得我很作死，为什么不直接用绝对定位就把垂直水平都搞定了。哈哈，一切源于一颗装B+傻B的心，不过，能实际体会一下flexbox带来的问题，我觉得也挺好的）。
结果在chrome下正常，IE11下就成上图那样了，我上MDN Web看了一下，说弹性布局是支持IE11的（下图），但是从上图来看，IE下垂直方向是对的，但是水平方向却不对，说明flexbox还是没被支持，我也尝试着添加了各种前缀，还是不行。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
