Обтекаемые изображения во вложениях

Вопросы по вёрстке и стилям оформления, шаблоны для wap версии phpBB и других различных стилей.
Правила форума
Не загружайте скриншоты(изображения) на внешние хостинги и размещения их ссылок в сообщениях. Такие сообщения могут остаться без ответа или будут удалены!
Аватара пользователя

Сcылка:

BBCode:

HTML:
Anvar
Администратор
Администратор
Сообщения: 1260
Зарегистрирован: 08.08.2014, 14:26
Репутация: 356
Статья форума:
Обтекаемые изображения во вложениях

Обтекаемые изображения во вложениях

Сообщение Anvar » 13.08.2014, 17:27 #1

Бывает что в сообщениях размещены несколько не больших изображений, но они блочно расположены друг под другом, хотя места справа как бы и достаточно что-бы поместиться там ещё изображению или даже нескольким картинкам.

Теперь мы решим эту проблему несколькими правками.

Открываем styles/prosilver/theme/content.css

Find Найти содержимое с полным или частичным совпадением.

Код: Выделить всё

.attachbox dd {
   margin-top: 4px;
   padding-top: 4px;
   clear: left;
   border-top: 1px solid #d8d8d8;
}

Replace with Замените найденное выше, новым содержимым.

Код: Выделить всё

.attachbox dd {
   margin-top: 4px;
   padding-top: 4px;
   clear: left;
   display: inline;
}
.attachbox dd dl {
   border-bottom: 1px solid #d8d8d8;
   margin: 2px;
}


Find Найти содержимое с полным или частичным совпадением.

Код: Выделить всё

/* Inline image thumbnails */

Add after Добавьте после найденного на новую строку.

Код: Выделить всё

div.inline-attachment, dl.thumbnail dt, dt.attach-image {
   display: inline;
}


Find Найти содержимое с полным или частичным совпадением.

Код: Выделить всё

dl.thumbnail img {

Add before Добавьте перед найденным на новую строку.

Код: Выделить всё

dl.thumbnail, dl.attachimg {
   display: inline-block!important;
}


Остаётся открыть styles/prosilver/template/attachment.html

Find Найти содержимое с полным или частичным совпадением.

Код: Выделить всё

      <!-- IF _file.S_IMAGE -->
      <dl class="file">

Replace with Замените найденное выше, новым содержимым.

Код: Выделить всё

      <!-- IF _file.S_IMAGE -->
      <dl class="file attachimg">


Данные изменения для стилей на базе prosilver
Не пишите в ЛС и ICQ вопросы которые можете задать на форуме!
Заказы по разработке не выполняю!

Аватара пользователя
Anvar
Администратор
Администратор
Сообщения: 1260
Зарегистрирован: 08.08.2014, 14:26
Репутация: 356

Обтекаемые изображения во вложениях

Сообщение Anvar » 30.11.2014, 11:14 #2

Расширение для phpBB3.1 Attach inline Img - Обтекаемые изображения

Пример как будет отображаться в сообщениях на форуме:
Обтекаемые изображения во вложениях - attach_inline_img.jpg
:


Вернуться в «Стили, графика, шаблоны и скины»