|
|
Модератор форума: Yuri_G |
Сообщество uCoz » Вебмастеру » Общие вопросы от вебмастеров » Аналог text-align="justify" для изображений |
Аналог text-align="justify" для изображений |
Три картинки стоят в ряд, мне нужно раздвинуть их от начала и до конца поля. Для текста подходит text-align="justify" в таких случаях.
Сейчас так: <a href="$IMG_URL1$"><img alt="Скриншот из фильма $ENTRY_TITLE$ / $AUTHOR_SITE$" class="screenshots" src="$IMG_SMALL_URL1$" width="170" height="100" /></a> <a href="$IMG_URL2$"><img alt="Скриншот из фильма $ENTRY_TITLE$ / $AUTHOR_SITE$" class="screenshots" src="$IMG_SMALL_URL2$" width="170" height="100" /></a> <a href="$IMG_URL3$"><img alt="Скриншот из фильма $ENTRY_TITLE$ / $AUTHOR_SITE$" class="screenshots" src="$IMG_SMALL_URL3$" width="170" height="100" /></a> в CSS: .screenshots {border: 3px solid #e3e3e3; outline: 1px solid #292929;} |
Амо, привет оберни это всё в блок, например .screen-wrap и задай ссылкам тоже класс:
Код <div class="screen-wrap"> <a href="$IMG_URL1$" class="screen-link"><img alt="Скриншот из фильма $ENTRY_TITLE$ / $AUTHOR_SITE$" class="screenshots" src="$IMG_SMALL_URL1$" width="170" height="100" /></a> <a href="$IMG_URL2$" class="screen-link"><img alt="Скриншот из фильма $ENTRY_TITLE$ / $AUTHOR_SITE$" class="screenshots" src="$IMG_SMALL_URL2$" width="170" height="100" /></a> <a href="$IMG_URL3$" class="screen-link"><img alt="Скриншот из фильма $ENTRY_TITLE$ / $AUTHOR_SITE$" class="screenshots" src="$IMG_SMALL_URL3$" width="170" height="100" /></a> </div> Теперь - стили: Код <style> .screen-wrap{ text-align: justify; text-justify:newspaper; width:100% } .screen-wrap:after{ content:''; display:inline-block; width:100%; } .scree-link{ display:inline-block; vertical-align:top; width:200px; height:200px; } .screenshots { border: 3px solid #e3e3e3; outline: 1px solid #292929; } </style> Кроме того, если ориентироваться на более свежие браузеры, то можно посмотреть в сторону Flex Можешь забрать этот код и вставить его себе, сам знаешь куда.
Сообщение отредактировал Head-Mad - Суббота, 28 Мар 2015, 17:02:57
|
| |||
| |||