在开发中用 flex遇到的问题

来源:互联网 发布:周易注疏 知乎 编辑:程序博客网 时间:2024/05/14 09:00

最近在学习flexbox布局,就想着在开发中试一下,然后遇到了以下问题 ,总结一下。
IE10及以下就不要考虑使用flex布局了 ,虽然可以使用旧版的flexbox,但是麻烦颇多。
flex-wrap 在开发时用这个来让项目换行,当给了父级高度时,如果只有俩项目,那么这两个项目会平分容器高度,比如,父级容器height:200px;当使用wrap的时候这两个项目的高度各100px; 三个项目就继续平分。
这里写图片描述
如果想调节项目间的距离可以使用margin,padding来解决,也可以在刚开始不给容器高度,给项目高度来撑开;
IE10下面使用flex-wrap,需要给容器设置宽度,并且项目要设置为块元素 ,行内元素使用flex-wrap不会自动换行。
**********************************************************************
同一个元素同时使用position(absolute、flexd)和flex时 ,flex属性会失效,解决办法就是在flex元素外面再套一层父级来使用position属性,父级要设置宽度!,相对定位不会导致felx失效!

1 0