CSS: Возможно ли адаптировать размер шрифта к ширине div?

У меня есть div с 70% шириной, и вот что я хочу делать:

поместите несколько слов в div
изменить размер шрифта, чтобы эти слова занимать всю ширину div

Возможно ли это только с помощью css? Вот мой код:

.parent {
  width:70%;
  height:auto;
  min-height:100px;
  background:red;
  font-size:10vw;
}

Please help me to change the font-size dynamically to the parent class
<hr>
<div class="parent">
  This Text
</div>

Ответы

Ответ 1

Возможно, не совсем то, что вы ищете, но что-то. Вы можете сделать как шрифт, так и элемент относительно ширины просмотра.

p {
  font-size: 5vw;
  background-color: red;
  width: 50vw;
}

<p>
  I'm a P!
</p>

Ответ 2

Да, но я думаю, вам нужно использовать JS (jQuery).

JS:

$(function(){

var box = $('.box');
var boxWith = box.width();

$('.box h1').css('font-size',boxWith);

});

https://jsfiddle.net/moongod101/sdfaatp8/

Ответ 3

**You can change font-size:10vh;**
        .parent {
      width:70%;
      height:auto;
      min-height:100px;
      background:red;
      color:white;
      font-size:10vh;
    }
    Please help me to change the font-size dynamically to the parent class
    <hr>
    <div class="parent">
      Text
    </div>

Ответ 4

Здесь я обновил его.... JS Fiddel

попробуйте использовать

CSS

.parent 
 {
      width:70%;
      height:auto;
      min-height:100px;
      background:red;
      font-size:10vw;          
  }



span{
      display:inline-block;
      transform:scale(1.8,1);
      -webkit-transform:scale(3,1);
 }

HTML

<div class="parent">
  <span>This Text</span>
 </div>