Как избежать смещения элементов макета при смене шрифта?
При смене шрифта с Roboto на Tahoma - сместились элементы (меню вертикальное, горизонтальное и т.д.), потеряли свои прежние размеры.
Вроде бы это из за формирование отступов от шрифта до него, слева, справа и т.д.
Как избежать такой серьезной ошибки при смене шрифта? Чтобы если меняется шрифт, размеры элементов оставались прежними?
Понять уже наконец, что в вебе нет фиксированных шрифтов и если смена шрифта с Roboto на Tahoma всё портит надо бить по рукам верстальщика и/или дизайнера.
Потому что даже один и тот же шрифт будет разной ширины в зависимости от OS, браузера, настроек сглаживания и т.п.
keche: нормально нарисованный и свёрстанный макет спокойно переживает изменение размеров шрифта (в разумных пределах). Без реальных примеров ничего более конкретного посоветовать нельзя.
Алексей Тен: Я начинающий верстальщик. И для меня пока загадка, как сделать правильно сделать чтобы не ломались элементы. Сделал я привязку и отступы от шрифта для элементов. Чтобы менять шрифт или его размер и чтобы ничего не ломалось. Нужно не привязываться к шрифт и не делать от него отступов? Как это реализовать? Или каким вариантом вы пользуетесь?
Вот, например на этом сайте ширина колонки слева 300px и ей совершенно неважно какого размера текст в ней. Или тут же меню сверху. Это просто набор слов с отступами между ними. И если меняется шрифт, то общая ширина этого меню может измениться, но это опять же никого не волнует потому что макет и вёрстка готовы к такому.
Алексей Тен: Можно вашу почту, чтобы прислать макет? Я думаю скорее всего проблема как раз в привязке отступов к тексту. Но так я читал по книге делается. А как же тогда для каждого текстового элемента свой div делать. Пока не могу понять...
каждый шрифт имеет свою ширину. можете только подобрать letter-spacing для шрифта и указывать его для определенного шрифта. но это будет смотреться не всегда красиво. поэтому лучше все же подгонять сайт под шрифт раз вы решились его поменять. или иметь 2 разных стиля если вы собираетесь менять шрифт одним щелчком.
А причем здесь letter-spacing? Шрифты имеют разные размеры, из за них ломаются элементы. Вопрос в том, какие методы использовать чтобы при смене шрифта, или его размера, не ломались элементы.
keche: ну тк элементы у вас плывут как раз так и из за того что шрифты имеют разные размеры. тобишь если в случае с Roboto у вас все нормально умещалось - то Tahoma шире - итого слова получаются в длину больше. а с помощью letter-spacing как раз можно уменьшить это расстояние между буквами на которое шрифт тахома и шире
