ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / line-height. А разве оно в полной мере не перекрывается, как например font-size?
8 сообщений из 8, страница 1 из 1
line-height. А разве оно в полной мере не перекрывается, как например font-size?
    #38624172
Програмёр
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Програмёр
Участник
Всем привет.

Пришлось углубиться в вёрстку... Давно не верстал. Да и вообще line-height в виде множителя никогда не юзал... а тут пришлось чужую вёрстку править и понеслась!!! :(

В общем, мне хром светит в отладчике (как и iceweasel (аналог firefox)), что line-height перекрыто... Но оно не перекрыто.
Изменение этого свойства у элемента-родителя ведёт к изменению высоты строки в child'е:

Код: html
1.
2.
3.
<span style="line-height: 1.5">
  <span style="line-height: 13px; font-size:13px;">123123123<br>123123123</span>
</span>



То есть при выставлении line-height: 13px я получаю высоту никак не в 13px, а где-то в 20 пикселей :)

Подскажите, это так и должно работать? или это какой-то косяк (причём что в chrome, что в firefox - ровно одинаково)... или мне руки ровнять надо?

P.S. сайт писан в doctype html (ну то есть html5). Но в принципе это не важно, так как я пробовал и в transitional то же изобразить... точно то же получил.
...
Рейтинг: 0 / 0
24.04.2014, 11:07
| Ответить | Цитировать | Написать  
line-height. А разве оно в полной мере не перекрывается, как например font-size?
    #38624293
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
Програмёр,

???
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
span {
	display:block;
}
</style>
</head>
<body>
<span style="line-height: 2.5">
  <span style="line-height:13px; font-size:13px;">123123123<br>123123123</span>
</span>
</body>
</html>
...
Рейтинг: 0 / 0
24.04.2014, 12:01
| Ответить | Цитировать | Написать  
line-height. А разве оно в полной мере не перекрывается, как например font-size?
    #38624333
Програмёр
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Програмёр
Участник
user89,

да, display: block исправляет ситуацию... НО!!!
Я же не могу все inline элементы делать блочными... ну так... на всякий случай :)

За предложенный вариант спасибо.... но это не исправление ситуации, а просто костыль, что бы скрыть косяк :)) приблизительно похожим костылём я сделал и на требуемом сайте. но хотелось бы понять эту мистику свойства line-height.
...
Рейтинг: 0 / 0
24.04.2014, 12:15
| Ответить | Цитировать | Написать  
line-height. А разве оно в полной мере не перекрывается, как например font-size?
    #38624336
Програмёр
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Програмёр
Участник
методом тыка определил, что применяется большее из значений :) то есть если у вложенного span выставить множитель в 10, то будет применён именно он.
...
Рейтинг: 0 / 0
24.04.2014, 12:17
| Ответить | Цитировать | Написать  
line-height. А разве оно в полной мере не перекрывается, как например font-size?
    #38624655
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
ПрограмёрТо есть при выставлении line-height: 13px я получаю высоту никак не в 13px, а где-то в 20 пикселей :)

Подскажите, это так и должно работать?
Да, так и должно быть по логике вещей. Т.к. межстрочный интервал не может быть другим у встроеного "строчного" элемента.
...
Рейтинг: 0 / 0
24.04.2014, 14:33
| Ответить | Цитировать | Написать  
line-height. А разве оно в полной мере не перекрывается, как например font-size?
    #38624708
Програмёр
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Програмёр
Участник
krvsaПрограмёрТо есть при выставлении line-height: 13px я получаю высоту никак не в 13px, а где-то в 20 пикселей :)

Подскажите, это так и должно работать?
Да, так и должно быть по логике вещей. Т.к. межстрочный интервал не может быть другим у встроеного "строчного" элемента.

блин :) а ведь точно... спасибо... я что-то не подумал.

Код: html
1.
2.
3.
<span style="line-height: 1.5">
  456<span style="line-height: 13px; font-size:13px;">123123123<br>123123123</span>456
</span>



Если бы что-то работало иначе, то такой код сделал бы "123123123" надстрочными относительно "456".

Хотя мне такая логика поведения нравится. Это было бы очень даже прикольно... и сильно помогло бы в формировании разных надстрочных и индексных значений :) И многого другого :)
...
Рейтинг: 0 / 0
24.04.2014, 14:51
| Ответить | Цитировать | Написать  
line-height. А разве оно в полной мере не перекрывается, как например font-size?
    #38624925
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Програмёр
Код: html
1.
2.
3.
<span style="line-height: 1.5">
  456<span style="line-height: 13px; font-size:13px;">123123123<br>123123123</span>456
</span>



Если бы что-то работало иначе, то такой код сделал бы "123123123" надстрочными относительно "456".

Хотя мне такая логика поведения нравится. Это было бы очень даже прикольно... и сильно помогло бы в формировании разных надстрочных и индексных значений :) И многого другого :)
Для этого можно использовать
Код: css
1.
position: relative;


и уже потом двигать/смещать элемент куда нужно...
...
Рейтинг: 0 / 0
24.04.2014, 16:42
| Ответить | Цитировать | Написать  
line-height. А разве оно в полной мере не перекрывается, как например font-size?
    #38624965
Програмёр
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Програмёр
Участник
krvsaПрограмёр
Код: html
1.
2.
3.
<span style="line-height: 1.5">
  456<span style="line-height: 13px; font-size:13px;">123123123<br>123123123</span>456
</span>



Если бы что-то работало иначе, то такой код сделал бы "123123123" надстрочными относительно "456".

Хотя мне такая логика поведения нравится. Это было бы очень даже прикольно... и сильно помогло бы в формировании разных надстрочных и индексных значений :) И многого другого :)
Для этого можно использовать
Код: css
1.
position: relative;


и уже потом двигать/смещать элемент куда нужно...

Это мы знаем ;)
...
Рейтинг: 0 / 0
24.04.2014, 17:09
| Ответить | Цитировать | Написать  
8 сообщений из 8, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / line-height. А разве оно в полной мере не перекрывается, как например font-size?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38624333&tid=1447160]:
 0ms
get settings:
 4ms
get forum list:
 13ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 45ms
get topic data:
 6ms
get forum data:
 3ms
get page messages:
 27ms
get tp. blocked users:
 1ms
others: 203ms
total:  306ms
созд. / загр.: 306ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]