css3 flex 布局的问题
本文介绍了css3 flex 布局的问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
附上地址， 或者看下面代码。
https://jsfiddle.net/2ydhkep5/
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
* {
margin:0;
padding:0;
}
body,html {
overflow: hidden;
width: 100%;
height: 100%;
}
.container {
width: 100%;
height: 100%;
display: -webkit-flex;
}
.box-a {
-webkit-flex: 5.5;
background: #ccc;
font-size: 30px;
}
.box-b {
-webkit-flex: 4.5;
background: #f6f6f6;
font-size: 30px;
}
</style>
</head>
<body>
<div class="container">
<div class="box-a">我是a</div>
<div class="box-b">我是b</div>
</div>
</body>
</html>
现在用的是 flex 布局
现在a在左边， b在右边。
我想实现， b在左边， a在右边。 ps: 不能改变div顺序。 我就想知道有没有属性可以调换顺序的。
解决方案
父元素设置：flex-direction:row-reverse;水平排列方向从右向左
参考：http://www.ruanyifeng.com/blo...
这篇关于css3 flex 布局的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
