1 Тема от neutral

  • neutral
  • neutral
  • В теме
  • Неактивен
  • Откуда: г. Хабаровск
  • Зарегистрирован: 01.11.2005
  • Сообщений: 157
  • Репутация : [ 0 | 0 ]

Тема: Текст обтекает картинки в сообщении

Чтобы так сделать нужно всего лишь открыть /style/imports/base.css и добавить в конец файла следующий код:

IMG.postimg {
    float: left;
    clear: left;
    margin: 5px;
}

Пример

Также можно сделать чтобы картинки обтекались текстом не справа, а слева. Тогда вместо float: left; нужно написать float: right;

Кроме того, картинки можно немного оформить для лучшего эстетического восприятия.
Ниже приведен код стилизованный под стандартную тему Cobalt.

IMG.postimg {
    padding: 2px;
    border: 1px #565656 solid;
    background: #424242;
    float: left;
    clear: left;
    margin: 5px;
}

После внесённых изменений в CSS не забудьте, обновить страницу нажав F5. smile

Предрассудок - плохой советчик!

Поделиться

2 Ответ от Гном

  • Гном
  • Интересующийся
  • Неактивен
  • Зарегистрирован: 23.02.2006
  • Сообщений: 35
  • Репутация : [ 0 | 0 ]

Re: Текст обтекает картинки в сообщении

neutral

Что-то не могу добиться чтобы не было отступа текста на одну пустую строчку вниз.
Т.е. картинка получается какбы приподнятой. И у тебя на скриншоте тоже текст опущен на одну строчку.
Как сделать чтобы вех картинки полностью совпадал с техстом по горизонтальной линии?

Поделиться

3 Ответ от neutral

  • neutral
  • neutral
  • В теме
  • Неактивен
  • Откуда: г. Хабаровск
  • Зарегистрирован: 01.11.2005
  • Сообщений: 157
  • Репутация : [ 0 | 0 ]

Re: Текст обтекает картинки в сообщении

Скорее всего текст должен начинаться сразу за тэгом img, без переноса строки

Предрассудок - плохой советчик!

Поделиться

4 Ответ от Гном

  • Гном
  • Интересующийся
  • Неактивен
  • Зарегистрирован: 23.02.2006
  • Сообщений: 35
  • Репутация : [ 0 | 0 ]

Re: Текст обтекает картинки в сообщении

Там что-то еще добавляется. Что-то вроде этого <b> or </p> or </n>...

У тебя на скриншоте таже проблема:
img231.imageshack.us/img231/7282/555555555ze.jpg

А когда я добавил еще второй вариант:

IMG.postimg {
    padding: 2px;
    border: 1px #565656 solid;
    background: #424242;
    float: left;
    margin: 5px;
}

То эта проблема еще увеличилась.

Поделиться

5 Ответ от neutral

  • neutral
  • neutral
  • В теме
  • Неактивен
  • Откуда: г. Хабаровск
  • Зарегистрирован: 01.11.2005
  • Сообщений: 157
  • Репутация : [ 0 | 0 ]

Re: Текст обтекает картинки в сообщении

Как я и говорил, моя проблема решилась тем способом, что я описал выше. Парсер ПунББ все переносы строки конвертирует в <br />. поэтому у меня там отступ сверху был.
Можешь сделать скриншот своей проблемы и привести код сообщения полученного в хтмл и того что ты ввел в форму?

Предрассудок - плохой советчик!

Поделиться

6 Ответ от Гном

  • Гном
  • Интересующийся
  • Неактивен
  • Зарегистрирован: 23.02.2006
  • Сообщений: 35
  • Репутация : [ 0 | 0 ]

Re: Текст обтекает картинки в сообщении

Все понял. Извиняюсь.
Дело в том что я смотрел по форуму те картинки которые уже были вставлены до этих изменений. А там юзеры сами вручную делали такие отступы.
Вобщем нормльно все. Еще раз экск. за беспокойство.

Поделиться

7 Ответ от neutral

  • neutral
  • neutral
  • В теме
  • Неактивен
  • Откуда: г. Хабаровск
  • Зарегистрирован: 01.11.2005
  • Сообщений: 157
  • Репутация : [ 0 | 0 ]

Re: Текст обтекает картинки в сообщении

Если текста мало и чтобы картинки не наезжали друг на друга, нужно добавить строчку clear: left; (если при этом свойство float установлено в left, если float: right, то и clear: right должно быть). Тогда даже без текста картинки будут идти всегда одна ниже другой

Предрассудок - плохой советчик!

Поделиться