внутри div сделать img+p к низу

[Вадим]

В общем делаю каталог продукции.

Каждая позиция товара находится внутри div. Div имеет фиксированный размер 200x200px.

Внутри DIV находится IMG. IMG имеет разный размер, но меньше 200px по высоте и ширене. Также внутри DIV есть P. В общем P нужно прибивать к низу DIV, а потом IMG прибивать к верху P. Но самое главное, все это добро должно быть по центру.

 <div id="content" class="catalog">
  <div><img src="img/okolco.png" alt="" /><p>Обручальные кольца <span>180</span></p></div>
  <div><img src="img/pechatka.png" alt="" /><p>Печатки <span>78</span></p></div>
  <div><img src="img/kolco.png" alt="" /><p>Кольца <span>73</span></p></div>
  <div><img src="img/cergi.png" alt="" /><p>Серьги <span>150</span></p></div>
  <div><img src="img/podveski.png" alt="" /><p>Подвески <span>15</span></p></div>
  <div><img src="img/kolie.png" alt="" /><p>Колье <span>36</span></p></div>
  <div><img src="img/brasleti.png" alt="" /><p>Браслеты <span>52</span></p></div>
  <div><img src="img/brelki.png" alt="" /><p>Брелочки <span>65</span></p></div>
 </div>

.catalog div {
	width: 200px;
	height: 200px;
	padding: 0;
	margin: 0;
	text-align: center;
	font-size: 14px;
	color: #6ba2ff;
	float: left;
	position: relative;
	}
.catalog img {
	position: absolute;
	bottom: 15%;
	left: 50%;
	}
.catalog p {
	position: absolute;
	bottom: 0%;
	left: 50%;
	}
.catalog span {
	color: #223f98;
	}

Если делать так, то почти получается, только left:50% криво работает, он берет начало IMG за точку отчета и получается, что в зависимости от ширины IMG картинка по разному центруется.

[psywalker]

Но самое главное, все это добро должно быть по центру.

Так вот положи всё это добро в общий контейнер, задай ширину и выровни по центру, как это делается по человечески

[Вадим]

Так вот положи всё это добро в общий контейнер, задай ширину и выровни по центру, как это делается по человечески

не понял

Вот как должно быть: www.w3u.ru/z02.jpg

А вот как у меня: www.w3u.ru/z01.jpg

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

Edited August 28, 2009 by Вадим

[psywalker]

а дай мне архив с картинками, я тебе сделаю

[Вадим]

а дай мне архив с картинками, я тебе сделаю

отправил. спасибо большое! простите, что такой нуб(

[psywalker]

отправил. спасибо большое! простите, что такой нуб(

Да всё нормально, сам не профи

[Вадим]

Друзья! Вы должны знать! psywalker лучший!!!!

[psywalker]

Друзья! Вы должны знать! psywalker лучший!!!!

Спасибо, рад, что смог как то тебе помочь

[VJiK]

Так как всё-таки сделали выравнивание в диве по нижнему краю?