Slarsen817 Ответов: 1

Минимальный размер отзывчивого текста

Я работаю над созданием своего сайта на Squarespace. У меня есть кодировка, настроенная для некоторого текста с "vw" (переменная ширина) для моего шрифта.
Он появляется на моем компьютере без проблем, но когда я просматриваю его на мобильном телефоне, текст становится очень маленьким.

есть предложения?

Что я уже пробовал:

Я искал несколько мест в интернете, и мне не повезло. Вот мой код ниже. 

<span style="font-size:1vw; letter-spacing:2px; line-height:1">APPARENTLY THIS PAGE TOOK THE DAY OFF TO GO BUY A HOME AND IS PROBABLY OUT LOOKING AT THE MOMENT... THATS OUR BAD...YOU CAN BE OUT LOOKING TO! JUST FOLLOW THE LINK BELOW! OR CLICK THE "GO BACK HOME BUTTON"</span>

Edit fiddle - JSFiddle[^]

Richard Deeming

Я удалил ссылку из вашего вопроса, так как это может быть расценено как "спам". Вместо этого я добавил ссылку на пример вашего кода JSFiddle.

1 Ответов

Рейтинг:
1

Richard Deeming

Два возможных решения от этот поток StackOverflow[^]:

1) Воспользуйся calc:

font-size: calc(10px + 1vw);
Edit fiddle - JSFiddle[^]

2) Использование медиа запросов:
.responsive-text {
    font-size: 10px;
    letter-spacing: 2px;
    line-height: 1;
}

@media (min-width:1000px) {
    .responsive-text {
        font-size: 1vw;
    }
}
Edit fiddle - JSFiddle[^]