Как понять поведение letter-spacing?

Question

[Станислав Пономарев]

Всем доброго времени суток! Подскажите мне, как понять такое поведение letter-spacing. При масштабировании экрана в браузере, letter-spacing остается неизменным. Вот на фото под картинкой, "ваша полка - верхняя" при масштабирование экрана по длине не изменяется

Comments

[Ilya Muromtsev]

А чего вы хотите добится? Какие единицы шрифта используете? Где собственно код?)

[Станислав Пономарев]

Ilya Muromtsev, letter-spacing: 0.15em. Мне бы хотелось, чтоб у фразы "ваша полка - верхняя" между буквами был зазор, для этого и применил letter-spacing. Только после этого фраза не уменьшается вместе с экраном, а остается в изначальном состоянии. Какой код нужен?

[Анита Ковалева]

em
Вот вы и нашли решение.

[Станислав Пономарев]

Анита Ковалева, получается дело в em?

[Анита Ковалева]

Станислав Пономарев, Все правильно, у вас размер шрифта указан в единицах измерения em. В отличии от px - em относительная единица измерения, берущая значение от родителя. Укажите letter-spacing в px - тогда значение будет фиксированным.

[Ankhena]

Станислав Пономарев,

получается дело в em?

нет.
Я только что попробовала и все масштабируется.
Но на всякий случай уточните, "масштабирование" это именно изменение масштаба или размера окна?

[Станислав Пономарев]

Ankhena, именно масштабирование. При изменении окна, все нормально уменьшается

[Ankhena]

Станислав Пономарев, в хроме на винде норм масштабируется, попробовала на странице тостера.

[Станислав Пономарев]

Ankhena, попробовал на хроме, тоже самое. Весь текст становится меньше, а вот фраза "ваша полка - верхняя" остается неименной

[Ankhena]

Станислав Пономарев, думаете, если еще 3 раза скрин приложите, мы поймем в чем дело?
Может, пора перейти к коду в песочнице?

[Lynn «Кофеман»]

В настройках браузера есть минимальный размер шрифта, в который вы видимо и упёрлись.
И к letter-spacing это не имеет никакого отношения.

[Станислав Пономарев]

Ankhena, сейчас, леди))

[Станислав Пономарев]

Ankhena, https://codepen.io/chembyrleno/pen/WNvxmBB

[Станислав Пономарев]

Алексей Тен, Заголовок уменьшается, только эта фраза остается без изменений. Если убрать letter-spacing то все норм становится, а без него сделать зазор между букв, не знаю

[Ankhena]

Станислав Пономарев,
смотрите, явно масштабируется

вот

[Станислав Пономарев]

Ankhena, вот посмотрите "Настоящая страна" уменьшилась, а "ваша полка" осталась как была

[Ankhena]

Станислав Пономарев, Ну так шрифт больше не может уменьшиться и letter-spacing соответственно тоже.

[Станислав Пономарев]

Ankhena, Спасибо огромное) разобрался

Answer 1

[cristalex]

Зачем вообще вы масштабируете экран браузера? Если проверяете адаптивность то в популярных браузерах есть специальные средства для изменения ширины макета в браузере.
Если вы, допустим, задали letter-spacing: 2px, то почему letter-spacing должен меняться при масштабировании? Перечитайте ещё раз как работает letter-spacing:
https://webref.ru/css/letter-spacing