Обернуть каждую строку в вместо (красная строка)

Поделиться1Чт, 9 Июн 2022 22:05:47

Автор: Лекс Даэ
Заслуженный
Зарегистрирован: Пт, 5 Июн 2020
Сообщений: 27
Уважение: +7
Позитив: +6
Последний визит:
Ср, 15 Мар 2023 07:01:08

Доброго дня. Нашла способ, как задать красную строку для каждого абзаца, обернутого в , но при этом это работает только для .
Внутри поста же абзацы базово бьются , и свойство text-indent не применяется. Можно ли как-то обернуть абзацы в или сделать свойство применимым к переносам строк в том числе? Нашла только про each-line, но эта штука не работает в хроме

Свернутый текст

И вдогонку - отступы после абзаца и переноса строки. margin-top и margin-bottom не применились, потому что это не абзацы, и как это сделать - не понимаю в упор

Исходное состояние
.punbb .post-content p {
margin: 0;
padding: 0 0 1em 0;
line-height: 150%;
}

Моя попытка
.punbb .post-content p {
margin: 0;
padding: 0 0 1em 0;
line-height: 150%;
text-indent: 10px each-line;
margin-top: 0.5em each-line; /* Отступ сверху */
margin-bottom: 0.5em each-line; /* Отступ снизу */
}

0

Поделиться2Чт, 9 Июн 2022 22:31:17

Автор: Лекс Даэ
Заслуженный
Зарегистрирован: Пт, 5 Июн 2020
Сообщений: 27
Уважение: +7
Позитив: +6
Последний визит:
Ср, 15 Мар 2023 07:01:08

Апдейт. Реально ли переоборачивать BR в P скриптом?

0

Поделиться3Пт, 10 Июн 2022 01:27:28

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51112
Уважение: +15195
Позитив: +11566
Последний визит:
Сегодня 10:33:28

Лекс Даэ
Выдайте текст с проблемой, тут в топике в двояком виде
1-е Просто вставьте текст в пост тут, затем следущим постом скопируте текст при редактировании в блок код - [code][/code](кнопка перед пипеткой тут в форме ответа) и скриншот поста с ранее запощенным текстом с проставленными красным стрелками, что -где не удовлетворяет

Отредактировано Deff (Пт, 10 Июн 2022 01:29:16)

0

Поделиться4Пт, 10 Июн 2022 21:56:00

Автор: Лекс Даэ
Заслуженный
Зарегистрирован: Пт, 5 Июн 2020
Сообщений: 27
Уважение: +7
Позитив: +6
Последний визит:
Ср, 15 Мар 2023 07:01:08

Deff
Как оно прописано в коде стиля

Код:

.punbb .post-content p {
  margin: 0;
  padding: 0 0 1em 0;
  line-height: 150%;
  text-indent: 10px; 
  margin-top: 0.5em; /* Отступ сверху */
  margin-bottom: 0.5em; /* Отступ снизу */
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
 }

Как оно ДОЛЖНО быть (красное - это линия отступа, красная стрелка - корректный отступ, синие - там, где их нет, хотя должны быть по decoration-break)

Как оно есть в коде после публикации (вместо идут разрывы строк, и на них почему-то не отрабатывает свойство decoration-break, хотя по описанию оно должно делать именно это - применяться к каждому разрыву строки)

Суть вопроса. Можно ли заменить на для абзацев (текстовых) в постах, чтобы работала отбивка после кусочка текста и красная строка? Или это нереально?
Или где-то неправильно описан класс?

Отредактировано Лекс Даэ (Пт, 10 Июн 2022 21:59:16)

0

Поделиться5Сб, 11 Июн 2022 21:40:59

Автор: МАЧОнаДАЧЕ
Заслуженный
Зарегистрирован: Ср, 4 Дек 2019
Сообщений: 936
Уважение: +449
Позитив: +820
Пол: Мужской
Последний визит:
Чт, 14 Сен 2023 06:56:15

Если не оибаюсь то......в блогах (в скрипе) аналог решения......

Отредактировано МАЧОнаДАЧЕ (Сб, 11 Июн 2022 21:41:26)

0

Поделиться6Вс, 12 Июн 2022 10:38:01

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51112
Уважение: +15195
Позитив: +11566
Последний визит:
Сегодня 10:33:28

Лекс Даэ
Пробуйте в HTML верх:

Код:

<script type="text/javascript">
$().pun_mainReady(function() {
function replac(str,p1){return p1+'</p><p>'}
var reg = /((?:[\s\S](?!<\/p>))*?)<br>/igm;
$('.post-content').each(function() {
var str = $(this).html().replace(reg, replac);
$(this).html(str);});});
</script>

Отредактировано Deff (Вс, 12 Июн 2022 10:42:57)

+1

Единый форум поддержки

Меню навигации

Пользовательские ссылки

Информация о пользователе

Обернуть каждую строку в <p> вместо <br> (красная строка)