Как указать отступ для br не делая его блочным?

Question

[rd100]

Возможно ли как-то изменить высоту отступа у br не предавая ему display:block, flex и д.р.?

Comments

[Ankhena]

Да даже если вы сделаете его блочным это вам никак не поможет.

Чего именно вы хотите добиться?

Может, вам line-height поможет?
Или вообще неверно используете br, вместо тега <p>, например

[rd100]

Ankhena, есть строка в которой нужно сделать разделение

<p>В лингвистике термин «текст» используется в широком значении, включая и образцы устной речи. <br>Восприятие текста изучается в рамках лингвистики текста и психолингвистики. </p>

В месте br нужно сделать переход на следующую строку и определенной высотой отступа между ними
Кроме как сделать br block и задать ему отступ, не получилось это изменить.
Но суть в том, что элемент не должен быть блочным!

[Ankhena]

rd100,

В лингвистике термин «текст» используется в широком значении, включая и образцы устной речи.
Восприятие текста изучается в рамках лингвистики текста и психолингвистики.

Кто сказал?
Должны быть какие-то очень весомые аргументы.
А пока ощущение, что кто-то сильно в чем-то заблуждается.

Вертикальные отступы есть у блочных и инлайн-блочных. У инлайновых - нет.

Замените на два p или оберните в span, сделайте его инлайн-блочным или блочным и задайте нужный вам отступ.

<p>В лингвистике термин «текст» используется в широком значении, включая и образцы устной речи. </p><p>Восприятие текста изучается в рамках лингвистики текста и психолингвистики. </p>

[FrelFrloich]

а в чём проблема задать отступы спану обвернув часть текста? кто вам сказал что элемент не должен быть ни строчным ни блочным и тд? В чём проблема впихнуть парочку бр?

[rd100]

FrelFrloich, сафари сказал. Парочка БР ломает дизайн фиксированным отступом

[FrelFrloich]

rd100, а религия запрещает обвернуть что надо и задать отступ?)

[rd100]

FrelFrloich, сафари...
С хромом проблем нет

[FrelFrloich]

rd100, и в сафари проблем нет, вы делаете что то не верно, скорее всего пытались обвернуть в спан.

[rd100]

FrelFrloich, ну-ну, сделай мне в сафари обрезание строк, где в строке будет блочный элемент в виде спана или предай там бр изменяемую высоту
-webkit-line-clamp: 5
Если сможешь, будешь красавчиком, но ты не сможешь

[FrelFrloich]

rd100, друг в твоём вопросе нет об обрезании строк, я думал ты имеешь ввиду просто скрыть/показать. Я бы не парился и сделал выводы через пыху. Но если так уж прям надо, я с таким редко сталкиваюсь, но на быстрый манер приходит js, раз css не пашет, определи последнее слово в контейнере и первую букву, после неё задай ... и всё.

Я не понимаю чего ты агрессируешь, ты бы с таким рвением вопрос формировал правильно. Пример покажи, из вопроса понятно что тебе не подходят бр, за место этого тебе Акхена полностью расписала всё.

Ты же понимаешь, что ты мог ошибиться, преподнести не так как ты хочешь (что в принципе ты и сделал), покажи код, объясни что не получается и т.д. что за ios у тебя, может ты с финды сафарми юзаешь, тогда успехов тебе в твоих начинаниях с этим. В общем, помоги людям помочь тебе, а не агрись и тыкай непонятно чем.

Answer 1

[Undefiend]

Тэг <br>грубо говоря переводит каретку на следующую строку, а не выполняет отступ. Этим занимается <p>

UPD: Хотя знаете, возможно Вам поможет такая конструкция

br {
margin: 10px;
}

Comments

[Ankhena]

UPD: Хотя знаете, возможно Вам поможет такая конструкция

Можете показать песочницу с работающим примером?

[Undefiend]

Ankhena, https://codepen.io/Osvex/pen/WNZGOYx

UPD: Аккаунта не было:D

[Ankhena]

Undefiend, я вижу так


20ти пикселей не вижу

[Undefiend]

Ankhena, Посмотрите еще раз. Отступы присутствуют что вверху что внизу (и это является минусом), возможно из-за этого это решение не будет подходящим, но факт в том что работает (криво косо)

[Ankhena]

Undefiend, ну да, margin от body никто не обнулил и остались по краям отступы. Это я вижу. Ещё вижу дефолтные margin у p.
2x50px отступов там где br - не вижу.
Более того, отображение вообще никак не меняется, хоть 10, хоть 50, хоть 3000.

Происходит это потому что br, во-первых, сам по себе имеет display inline.
А во-вторых, к нему не применятся отступы даже если вы сделаете его блочным или инлайн-блочным. Не смотря на то, что инспектор будет не моргнув глазом, врать вам, что они есть.

[Undefiend]

Ankhena, Не совсем сейчас понимаю выставление на показ Ваших знаний о CSS или о BR. Потребовался отступ? Вот, пожалуйста он есть. Возможно есть много нюансов, но может Вы предложите лучше вариант конкретно в случае с BR?

[Ankhena]

Вот, пожалуйста он есть.

Во-первых, только в FF (зато прямо для инлайнового, что поразительно). Других браузеров, где это работает таким же образом не нашла. Возможно, они есть.

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

выставление на показ Ваших знаний о CSS или о BR

Кстати, всё наоборот, сюда я хожу ЗА знаниями. И вопросы пользователей довольно регулярно эти знания обогащают, пока найдешь/придумаешь для них решение. В частности и этот вопрос.

но может Вы предложите лучше вариант конкретно в случае с BR?

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

Если вы увидели в моих словах наезд, нет, его там нет и извините.

[Undefiend]

Ankhena, Да, вы правы. Решение наверное нацелено только на FF :D
Занимаюсь этим только как хобби, не обращаю внимания на кроссбраузерность