Как в css менять размер шрифта, но не размер div в котором он находиться?

Question

[TreShk0]

Есть div с одним параграфом, но при смене размера шрифта параграфа увеличивается div. Как этого избежать?

Comments

[Евгений Калибров]

@TreShk
вы хотите, что бы текст выступал за рамки div'a?

[Anton fon Faust]

На размер блочного элемента влияют (при box-sizing, который по дефолту установлен в: content-box):
1) border
2) padding
3) content (точнее пространство занимаемое им)

можно уменьшить паддинги если они есть
можно уменьшить межстрочный/межбуквенный интервал
можно сделать transform:scale(), но в этом случае могут быть проблемы с "замыливанием"
можно поставить overflow: hidden, но тогда контент, выходящий за пределы блока будет не виден

[Ankhena]

https://jsfiddle.net/btsqp55p/
Блок останется всегда 200 на 200, текст из него будет торчать, только смысл?
Можно включить прокрутку, как в примере для блока .d1.
Или скрыть лишнее с помощью overflow: hidden.

Answer 1

[Михаил Федотов]

Возможно, вам поможет следующее решение:

div {
  overflow: hidden;
}

Но в таком случае, если параграф будет больше, чем div, текст будет не виден. Он как бы выйдет за рамки div и скроется.

Answer 2

[Александр Алексеев]

жестко зафиксировать line-height в пикселях
хотя буквы станут шире и строк станет больше, но если одно слово и места хватает то сойдет

Answer 3

[Дима Паутов]

Задать элементу div фиксированные размеры. А как иначе то? Это самое правильное поведение.