84669 人学习
152542 人学习
20005 人学习
5487 人学习
7821 人学习
359900 人学习
3350 人学习
180660 人学习
48569 人学习
18603 人学习
40936 人学习
1549 人学习
1183 人学习
32909 人学习
header是用的flex布局，想要搜索框水平居中，类似原生IOS里面的布局
不受左右两边内容的影响，依然水平居中我记得我之前实现过，后来用了flex.css就忘了，麻烦看看用这个怎么实现
.header{ display:flex; flex-flow:row nowrap; align-item:center; justify-content:space-around; }
详细了解Flex布局见：http://www.ruanyifeng.com/blo...
只有三个元素可以直接用 space-between 撑开
https://jsfiddle.net/straybug...
你后来更新的
不受左右两边内容的影响，依然水平居中
既然不受影响那么只能是 absolute 抽离出来再居中了。
主要用到align-items: center即可这是demo
align-items: center
中间那个就用绝对定位,左右边宽度不一样的话会影响中间位置
.search { position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
详细了解Flex布局见：http://www.ruanyifeng.com/blo...
只有三个元素可以直接用 space-between 撑开
https://jsfiddle.net/straybug...
你后来更新的
既然不受影响那么只能是 absolute 抽离出来再居中了。
https://jsfiddle.net/straybug...
主要用到
align-items: center即可这是demo
中间那个就用绝对定位,左右边宽度不一样的话会影响中间位置