<html> <head><meta charset="utf-8">
<title>Ссылки</title>
</head> <body><div class="weather">
<p>31.08</p>
<img src="http://htmlbook.ru/files/weather-sun.jpg"> <span>+20<sup>o</sup></span>
</div><div class="weather">
<p>1.09</p>
<img src="http://htmlbook.ru/files/weather-snow.jpg"><span>-3<sup>o</sup></span>
</div><div class="weather">
<p>02.09</p>
<img src="http://htmlbook.ru/files/weather-blizzard.jpg"><span>-10<sup>o</sup></span>
</div> </body></html> div {float:left;
margin:1px;
width:133px;
height:170px;
}
.weather:hover {
box-shadow: 0 0 3px 5px #ccc;
}
p {text-align:center;
background: blue;
color: #fff;
font-size:1.6em;
width:134px;
height:30px;
padding:0;
margin:0;
}
span {font-size: 2em;
text-align:center;
font-size:1.6em;
width:134px;
height:29px;
display:block;
}
img {margin-left:10px;
}