Ответственный шрифт не работает

Question

Я хочу создать отзывчивый шрифт Я использую библиотеку fittext.js, но мне приходится сталкиваться с проблемой при определении размера шрифта по умолчанию.

Плагин позволяет мне ввести минимальную и максимальную ширину шрифта. Проблема заключается в том, что заголовок принимает минимальный размер как размер по умолчанию и не меняется!

вот мой код

<div class="notes"> 
     <h1>Large Title</h1> 
     <p>Text about image 1 in slider it may have many many many text</p> 
</div> 

и вот CSS

.notes{ 
position: absolute; 
top:30.9%; 
left:5.06%; 
width:27.9%; 
min-height:234px; 
height:auto; 
color:#ffffff; 
font-size: 12px; 
background-color: #eb7b7a; 
} 
div.notes h1{ 

padding-left: 45px; 
width:100%; 
float: right; 
font-weight: bold; 
text-align: center; 
font-size: 6em ; 
position: relative; 
margin-top:54px; 


} 

и я ставлю тег сценария после тега

$(".notes h1").fitText(1, { minFontSize: '60px', maxFontSize: '105px' }); 

размер по умолчанию 60 и еще 60 при изменении размера окно!

Что мне делать?

Answer 1

Что произойдет, если вы сделаете заголовок более крупным? Похоже, размер шрифта должен увеличиваться, чтобы заняться свободным пространством.

Вы можете получить больше ответов, если вы покажете свой рабочий код ...

Answer 2

CSS советы

Убедитесь, что ваш заголовок дисплей: блок; или отображение: встроенный блок; с указанной шириной, то есть шириной: 100%.

Не отображать дисплей: блок или дисплей: встроенный блок в CSS. Обязательно следуйте их readme!

https://github.com/davatron5000/FitText.js