box-flex 分割

<!DOCTYPE html>

<html>

<head>

<style>

.box{ width: 300px; height: 100px; background-color: red; display: -webkit-box; display: -moz-box; display: box;}

.siblings-left{ -webkit-box-flex: ; -moz-box-flex: ; box-flex: ; background-color: green;}

.siblings-right{ -webkit-box-flex: ; -moz-box-flex: ; box-flex: ; background-color: blue;}

</style>

</head>

<body>

<div class="box">

    <div class="siblings-left"></div>

    <div class="siblings-right"></div>

</div>

</body>

</html>

均分，高版本可代替float

IE高低版本据不支持

相关文章