Картинки Html+css

[JoyStick]

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

Нуна реализовать все на хтмл+ксс.

[psywalker]

UL-LI

[JoyStick]

UL-LI

уверенны?

нужно что бы картинки отображались разного размера и растягивались(резиновый), и что бы картинки на всю ширину тянулись...

и центрирование было именно по центру картинки, т.е.

img {

vertical-align:middle;

}

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

Edited April 11, 2011 by JoyStick

[Быколай]

<style type="text/css">
div.images {text-align: justify;}
div.images img {height: 120px; width: auto; padding: 10px;}
</style>
<div class="images">
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
</div>

я бы как-то так сделал, одинаковыми по высоте, или вы хотите именно разного размера?

[JoyStick]

<style type="text/css">
div.images {text-align: justify;}
div.images img {height: 120px; width: auto; padding: 10px;}
</style>
<div class="images">
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
</div>

я бы как-то так сделал, одинаковыми по высоте, или вы хотите именно разного размера?

нужно именно разного размера

[Быколай]

нужно именно разного размера

<style type="text/css">
div.images {text-align: justify; }
div.images img {max-height: 120px; max-width: 120px; padding: 10px; vertical-align: middle;}
</style>
<div class="images">
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="r_t.jpg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="1945.jpg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
 <img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>
</div>

??

Edited April 11, 2011 by Быколай

[JoyStick]

<style type="text/css">

div.images {text-align: justify; }

div.images img {max-height: 120px; max-width: 120px; padding: 10px; vertical-align: middle;}

</style>

<div class="images">

<img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>

<img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>

<img src="r_t.jpg" alt=""/>

<img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>

<img src="1945.jpg" alt=""/>

<img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>

<img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>

<img src="0_b6b_c11bc3fb_XL.jpeg" alt=""/>

</div>

??

именно)) спс)

[Быколай]

именно)) спс)

на здоровье