Форум на Исходниках.RU

Интервал между двумя строками

Jin X — Mon, 13 Jul 2015 19:32:56 +0000

Jin X: Есть один текст и есть другой, между ними должен быть интервал. Так что, мухи выше, котлеты ниже :)

Интервал между двумя строками

K313 — Mon, 13 Jul 2015 19:25:43 +0000

K313:

Цитата Jin X @ 13.07.15, 17:50

Главное - не первую _физическую_ строку отделить от всего остального текста, а первую смысловую, т.е. первую часть текста.

Ок! просто вы мутили там что то с first-line, вот я и подумал...

Ну а так, может Вам не мух нужно от катлеты отодвигать, а взять всюкотлету и сдвинуть её пониже? например заключив в тег

...

Интервал между двумя строками

Jin X — Mon, 13 Jul 2015 17:50:04 +0000

Jin X:

Цитата K313 @ 13.07.15, 16:11

они обе будут отступать от последующего текста.

Ну, так это наоборот хорошо :)

Добавлено 13.07.15, 17:50
Главное - не первую _физическую_ строку отделить от всего остального текста, а первую смысловую, т.е. первую часть текста.

Интервал между двумя строками

K313 — Mon, 13 Jul 2015 16:11:32 +0000

K313:

Цитата Jin X @ 13.07.15, 10:52

K313, о чём ты?

о том что если див с узится, то первая строка может превратиться в две строки и они обе будут отступать от последующего текста.

Интервал между двумя строками

Serafim — Mon, 13 Jul 2015 12:49:46 +0000

Serafim:

Цитата Serafim @ 08.07.15, 02:04

строка - это инлайновый (текстовый), а не блочный элемент (квадрат)

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

Интервал между двумя строками

Jin X — Mon, 13 Jul 2015 12:28:32 +0000

Jin X: Мне не понятен такой ответ :)
Чем это лучше и где тут забота? :)

Интервал между двумя строками

Serafim — Mon, 13 Jul 2015 12:27:37 +0000

Serafim:

Цитата Serafim @ 13.07.15, 11:41

предрекая вопросы "накуя" - о семантике забочусь

Интервал между двумя строками

Jin X — Mon, 13 Jul 2015 12:26:13 +0000

Jin X: А чем вариант

<span style="display: inline-block; margin-bottom: 8px;">Первая строка</span><br />Вторая строка

лучше варианта:

<div style="margin-bottom: 8px;">Первая строка</div>Вторая строка

???

Добавлено 13.07.15, 12:26
Если работают одинаково...

Интервал между двумя строками

Serafim — Mon, 13 Jul 2015 11:41:27 +0000

Serafim:

Цитата Serafim @ 06.07.15, 18:17

display: inline-block

Добавлено 13.07.15, 11:50
предрекая вопросы "накуя" - о семантике забочусь :)

Интервал между двумя строками

Jin X — Mon, 13 Jul 2015 10:52:05 +0000

Jin X: K313, о чём ты?

Serafim, каким образом ты хочешь увеличить интервал через span?
span не работает!!! div работает. Сам попробуй...

Интервал между двумя строками

Serafim — Wed, 08 Jul 2015 02:04:29 +0000

Serafim:

Цитата Jin X @ 07.07.15, 18:12

Проще через div

Через span :whistle:

Добавлено 08.07.15, 02:05
строка - это инлайновый (текстовый), а не блочный элемент (квадрат)

Интервал между двумя строками

K313 — Tue, 07 Jul 2015 20:23:32 +0000

K313:

Цитата Jin X @ 07.07.15, 18:12

Проще через div

если длина первой строки не меняется

Интервал между двумя строками

Jin X — Tue, 07 Jul 2015 18:12:29 +0000

Jin X: Проще через div :)

Интервал между двумя строками

Serafim — Tue, 07 Jul 2015 10:38:41 +0000

Serafim: да, ты прав, какой-то левак с этой first-line. Вот такой хак работает: http://jsbin.com/hurodolaxi/1/edit?html,css,output

Интервал между двумя строками

Jin X — Tue, 07 Jul 2015 06:04:32 +0000

Jin X: Вот так?

#promo_codebox:first-line {

display: inline-block;

padding-bottom: 16px;

}

Не пашет...

Интервал между двумя строками

Serafim — Mon, 06 Jul 2015 18:17:10 +0000

Serafim: паддинг вроде должен срабатывать :unsure: он для любых элементов прокатывает. Но если нет, для first-line добавь display: inline-block, тогда точно будет всё работать, включая ширину и высоту даже.

Интервал между двумя строками

Jin X — Mon, 06 Jul 2015 16:17:16 +0000

Jin X:

Цитата Serafim @ 06.07.15, 15:30

Других вариантов, кроме (первый чар - :first-letter, и первая строка - :first-line) нету.

Не понял, как этим пользоваться применительно к конкретному id или классу:

#promo_codebox {

position: fixed;

bottom: 10px;

left: 10px;

z-index: 1000000;

background: #400;

padding: 10px 12px;

border: 2px solid #fc0;

border-radius: 4px 4px 4px 4px;

font-family: Tahoma, Verdana, Arial, sans-serif;

font-size: 13pt;

color: #fff;

}

Вот как здесь сделать первую строку с margin-bottom: 6px; ? :huh:

Добавлено 06.07.15, 16:19
Ну или padding-bottom.

Добавлено 06.07.15, 16:21
Понятно... magrin и padding там не поддерживается, только так:

#promo_codebox::first-line {

line-height: 200%;

}

Но опять же, те же проблемы...

Интервал между двумя строками

Serafim — Mon, 06 Jul 2015 15:30:37 +0000

Serafim:

Цитата Jin X @ 06.07.15, 14:24

красивый

Цитата Serafim @ 04.07.15, 17:20

Более верно будет использовать span

А дальше со всеми паддингами. Других вариантов, кроме (первый чар - :first-letter, и первая строка - :first-line) нету.

Интервал между двумя строками

Jin X — Mon, 06 Jul 2015 14:24:49 +0000

Jin X: Я же уже говорил про line-height: он будет раздвигать верхнюю и нижнюю границы (условно говоря, padding-top и padding-bottom).
div работает как надо, но возможно есть более красивый вариант.

Интервал между двумя строками

Serafim — Sat, 04 Jul 2015 17:20:59 +0000

Serafim: div - это блочный элемент, так что однозначно нет. Более верно будет использовать span и уже в нём указывать line-height

Интервал между двумя строками

Jin X — Thu, 02 Jul 2015 14:37:46 +0000

Jin X: Нужно увеличить интервал между двумя строками. Если делать line-height: 150%, то как следует из названия этого свойства, увеличивается высота обеих строк, т.е. если вокруг строк есть граница (border), то эта граница отодвинется вверх от верха первой строки и вниз от низа второй. Мне же нужно тупо увеличить расстояние между строками. Сделал вот так:

<div style="margin-bottom: 8px;">Первая строка</div>Вторая строка

Но, сдаётся мне, можно как-то красивее это реализовать... Я прав? :)