проблема с "vertical-align:"

[Kos87]

Привет! День мучусь, не могу понять где допустил ошибку ... . Вторая фото не ровняется по вертикали.

Может кто просветит где ошибка?

Имеется код html

        <div class="photo_block">
            <div class="photo">
                <a href="album/deti/IMGP4331.JPG" rel="lightbox[deti]"><img src="album/deti/IMGP4331.JPG" border="0" height="200px" /></a>
            </div>
            <div class="photo">
                <a href="album/deti/IMGP4332.JPG" rel="lightbox[deti]"><img src="album/deti/IMGP4332.JPG" border="0" height="100px" /></a>
            </div>
            <div class="photo">
                <a href="album/deti/IMGP4334.JPG" rel="lightbox[deti]"><img src="album/deti/IMGP4334.JPG" border="0" height="200px" /></a>
            </div>
            <div class="photo">
                <a href="album/deti/IMGP4336.JPG" rel="lightbox[deti]"><img src="album/deti/IMGP4336.JPG" border="0" height="200px" /></a>
            </div>
        </div>

и CSS

.photo_block{
  background-color: #FFFF33;
  position: relative;
  height: 200px;
  clear: both;
}
.photo {
  height: 100%;
  width: 25%;
  background-color: green;
  float: left;
  text-align: center;
}

.photo img{
  background-color: red;
  vertical-align: middle;
}

вот страница с проблемой http://2kadra.com.ua/album_deti.shtml

Edited October 13, 2011 by Kos87

[psywalker]

А с чего ты решил, что она должна выравниваться?

[Kos87]

я ж "img" дал vertical-align: middle;

а его родитель высотой в 100%, то есть зазор вниз есть, и следовательно должно выровнять ...

[psywalker]

я ж "img" дал vertical-align: middle;

а его родитель высотой в 100%, то есть зазор вниз есть, и следовательно должно выровнять ...

А вот теперь, когда ты поменял код, уже выравнивается

[Kos87]

это да, но мне помогли.