Как сжимать только текст с помощью transform:scale()?

Question

[historydev]

Добрый вечер.Я использую вот такую конструкцию для сжатия текста в зависимости от кол-ва символов.Но сжимается весь блок, а мне нужно сжимать только текст в нём, как этого достичь?Спасибо заранее.

$('.result2').css('transform','scale(' + scale2 + ',1.0)');

<div class="home home2"><div><div class="result2"></div></div></div>

Comments

[Михаил]

обернуть текст в блок и сжимать его

[historydev]

Михаил, уже обёрнут в блок

[Михаил]

Владимир, значит ещё в 1 оберните

[historydev]

Михаил, мы близки к победе в 3-х дневной войне

[historydev]

Михаил, всё ещё уменьшается блок

[Михаил]

Владимир, а уменьшаете что?

[historydev]

Михаил, result2

[Михаил]

Владимир, если уменьшать result2 то он и будет уменьшаться, вам текст нужно уменьшить или блок?

[historydev]

Михаил, текст, текст, блин, если вы поможете, я буду жить

[Михаил]

Владимир,
https://codepen.io/notiv/pen/ExYzxbE

[historydev]

Михаил, есть разница между inline-flex и inline-block?Просто у меня flexbox

[Михаил]

Владимир, inline-что-то это что-то только по ширине контента

[historydev]

Михаил, дело в том что я это всё применил и разницы нет почему-то

[historydev]

Михаил, да, спасибо, уже почитал.Вот смотрите, он не уменьшается, но уезжает почему-то.

[Михаил]

Владимир, transform-origin может

[historydev]

Михаил, не помогло

[historydev]

Михаил, залить на хост?Может если увидишь, сможешь понять?

[Stalker_RED]

Владимир, собери в песочнице, типа jsfiddle или codepen

[historydev]

Stalker_RED, это геморно будет, правда, мне проще на хост залить

[historydev]

Stalker_RED, freelance.na4u.ru/street.html

[historydev]

Михаил, freelance.na4u.ru/street.html

[Михаил]

Владимир,
Что я здесь должен увидеть?

[historydev]

Михаил, напишите в поле 2 текст

[Михаил]

Владимир,

.result2 {
  width: 300px;
}

span который В НЕМ

display: inline-block;
transform-origin: left;
transform: scale(X, 1);

[historydev]

Михаил, Представьте что резалт это и есть спан, спасибо огромное, вы избавили меня от такого гемороя, вы спаситель.Кидайте ответ.

[Роман]

Владимир, делали бы сразу в svg или средствами canvas-а

Answer 1

[Михаил]

.result2 {
  transform-origin: left;
  transform: scale(X, 1);
}