Перейти к публикации
Дизайн и модификация IPS Community IPBSkinsBETA
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...
Вова1986

Выравнивание изображения по центру

Рекомендованные сообщения

Здравствуйте.

Хочу сделать вывод случайых изображений в квадратных боксах.

 

Пример на картинке:

 

b95537aa9173.jpg

 

Код в шаблоне и CSS

<div id='attach_wrap' class='rounded clearfix'>
<ul>
<foreach loop="gallery_images_hook:$rows as $r">
	<li class="clip">{$r['_image']}</li>
</foreach>
</ul>
</div>

 

.clip {
vertical-align: middle; 
text-align: center; 
position: relative;		
height: 100px;
width: 100px;
border: solid 1px #ccc;
	overflow: hidden;
}
.clip img {
height: 160px;
}

 

Как видно из картинки последнее изображение вообще не разобрать, т.к. по умолчанию стоит выравнивание по горизонтали слева и по вертикали сверху. Прописывал "vertical-align: middle;" и "text-align: center;" но ничего не происходит. Выравнивать "margin" и "pading" смысла нет.

 

Как решить проблему?

Поделиться сообщением


Ссылка на сообщение

Потому что форматирование идет из

	#attach_wrap li {
	margin: 5px 6px;
	float: left;
}

Уберете float: left;, они в столбик выстроятся.

 

 

Можно попробовать

float: left; заменить на display: inline;

И добавить

#attach_wrap ul {
text-align: center;
}

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

Поделиться сообщением


Ссылка на сообщение

Здравствуйте.

 

Хотел бы расположить равномерно картинки в блоке "последние фото из галереи" на всю длину блока.

Изменение float: left на float: center выстраивает картинки вертикально, float: right в линию но к правой стороне.

Как это можно сделать?

Скин ваш, delicate_complete.

 

 

post-39527-021860700 1280301218_thumb.jpg

Поделиться сообщением


Ссылка на сообщение

Спасибо, все получилось как надо!

Поделиться сообщением


Ссылка на сообщение

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу.

×
×
  • Создать...