请教各位大神,每个方块都设置了float:left;如何用css或者其他方法使方块上下紧密排列,自动对齐

html-css016

请教各位大神,每个方块都设置了float:left;如何用css或者其他方法使方块上下紧密排列,自动对齐,第1张

左边那两个可以float:left,右边那三个就float:right嘛。每个div设置position:relative相对定位,再设置left、top、right来稍微调整一下。

里面的两个div长宽设置成一样的,都float不就上下对齐了吗,还是有什么特殊要求?

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

<style type="text/css">

.wrap{width:100%height:500pxbackground: redfloat:left}

.wrap div:nth-child(1){width:200pxheight:200pxbackground: yellowfloat: left}

.wrap div:nth-child(2){width:200pxheight:200pxbackground: bluefloat: left}

</style>

</head>

<body>

<div class="wrap">

<div></div>

<div></div>

</div>

</body>

</html>