Settando per la galleria immagini dei DIV flottanti, all'interno dei quali posizionati degli altri in maniera assoluta, si riesce a controllarne l'overflow in modo molto simile a quel che hai visto.
Prova questo:
P.S.: ovviamente le proprietà CSS3 "-moz-box-shadow" e "-webkit-box-shadow" sono supportate solo da browser Mozilla e Webkit
HTML
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Galleria immagini XHTML</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div class="gallery">
<div>
<a href="#">
<img src="URL_IMMAGINE" alt="IMMAGINE" />
<span class="h2">Leggi la ricetta »</span>
<strong class="h1">"eyeball" cupcakes</strong>
<span>Descrizione<br /><br />Anche con<br />più righe</span>
</a>
</div>
<div>
<a href="#">
<img src="URL_IMMAGINE" alt="IMMAGINE" />
<span class="h2">Leggi la ricetta »</span>
<strong class="h1">america's favorite grilled cheese sandwitch</strong>
<span>Descrizione<br /><br />Anche con<br />più righe</span>
</a>
</div>
<div>
<a href="#">
<img src="URL_IMMAGINE" alt="IMMAGINE" />
<span class="h2">Leggi la ricetta »</span>
<strong class="h1">a great plate</strong>
<span>Descrizione<br /><br />Anche con<br />più righe</span>
</a>
</div>
<div>
<a href="#">
<img src="URL_IMMAGINE" alt="IMMAGINE" />
<span class="h2">Leggi la ricetta »</span>
<strong class="h1">asian beef "spring rolls"</strong>
<span>Descrizione<br /><br />Anche con<br />più righe</span>
</a>
</div>
</div>
</body>
</html>
CSS
body { background: #ffc }
.gallery { margin: 100px; width: 500px; font-family: sans-serif }
.gallery div {
position: relative;
float: left;
margin-right: 30px;
margin-bottom: 20px;
width: 160px;
height: 140px;
}
.gallery a {
position: absolute;
top: 0;
left: 0;
padding-bottom: 16px;
width: 160px;
text-decoration: none;
background: #fff;
color: #444;
z-index: 2;
}
.gallery a:hover {
top: -20px;
left: -20px;
width: 200px;
z-index: 10;
-moz-box-shadow: 3px 3px 10px #666;
-webkit-box-shadow: 3px 3px 10px #666;
}
.gallery a img {
display: block;
margin-bottom: 1px;
border: 0;
background: #ccc;
width: 100%;
height: 80px;
}
.gallery a span {
display: none;
padding: 16px;
padding-bottom: 0;
font-size: 11px;
}
.gallery a:hover span { display: block }
.gallery a span.h2 {
padding-top: 4px;
padding-bottom: 0;
background: #09f;
color: #fff;
font-weight: bold;
}
.gallery a strong.h1 {
display: block;
border-top: 4px solid #09f;
padding-top: 6px;
}
.gallery a:hover strong.h1 {
padding-left: 20px;
padding-right: 20px;
color: #09f;
}
Ciao!