<html>
<head>
<meta charset='utf-8'>
<title>title</title>
</head>
<body>
<div style='
background-color: #999999;
padding: 10px;'>
<div style='
background-color:red;
width:100px;
height:100px;
float:left;'>1
</div>
<div style='
background-color:blue;
width:50px;
height:50px;
float:left;'>2
</div>
<div style='clear:left;'></div>
</div>
</body>
</html>
как выравнить синий див относитльно красного. Чтобы получилось как на втором рисунке