Что делать, если текст сам меняет размер?

Question

[Матвей Тепайкин]

есть текст, у него размер 6px, но там нет 6px, он намного больше. я решил посмотреть размер шрифта через консоль и увидел там 24px, хотя в css указан размер 6px. почему так ?
причем вся эта фигня происходит только в яндексе и опере
а вот как в хроме отображается
ссылка на сайт misiktepay.temp.swtest.ru

Comments

[WapSter]

На столько информативно, что ответа ты не получишь никогда)

[Матвей Тепайкин]

WapSter, текст сам изменяется, какая блин ещё нужна инфа?

[Михаил]

Матвей Тепайкин, кому вообще в голову придёт ставить шрифт 6px ?

[Матвей Тепайкин]

WapSter, потому я не знаю как эту херню описать!

[Матвей Тепайкин]

Михаил, боже. причем тут вообще это?! это для демонстрации данной проблемы.

[WapSter]

Матвей Тепайкин, верстаю вот уже седьмой год, и ни разу за это время размер шрифта не изменялся сам по себе.

[Матвей Тепайкин]

Михаил, суть в том что он изменяется сам в яндексе и опере!!!

[Михаил]

WapSter, в браузере можно выставить минимальный размер шрифта, тогда это и можно засчитать в "сам по себе"
Но вангую проблема не в этом

[Матвей Тепайкин]

WapSter, ну вот, всё бывает в первый раз. теперь вы видели всё.

[Froggyweb]

это ответ
не используй масштабирование экрана, используй инструменты разработчика в браузере для адаптива

[Михаил]

Матвей Тепайкин, ну не используйте тогда яндекс и оперу, и проблемы не будет

[Матвей Тепайкин]

WapSter, могу скинуть html и css файлы

[WapSter]

Михаил, да нет это уже рукоблудство отдельного пользователя. Если это не заказчик то пофиг.

[Михаил]

Матвей Тепайкин, по голубиной почте rar архивом

[Матвей Тепайкин]

Михаил, посмотри на меню сайта на первой фотке и увидите, что там текст не изменяется...

[Матвей Тепайкин]

Михаил, ну, может ещё потом и клиентам такое посоветовать?

[WapSter]

Матвей Тепайкин, да нам пофиг на скриншотики твои, ту информацию которую ты предоставил, недостаточно для ответа. Мы вернемся к началу комментов или ты подумаешь головой?

[Михаил]

Матвей Тепайкин,

[Матвей Тепайкин]

Froggyweb, это поможет не видеть проблему, но не решит её... многие люди используют браузер не на полный экран и не стоковый масштаб, значит у них будет эта проблема, поэтому надо её решить, а я не знаю как. причем это только в яндексе и опере

[WapSter]

Матвей Тепайкин, верстая адаптивно, ты сразу делаешь сайт дружественным к слабовидящим. Используя верные тэги, сайт чуть более дружественным для слепых. Код выложи на гитхаб или на хостинг залей. Уже бы 10 раз это сделал.

[Матвей Тепайкин]

Михаил, тут я хотел показать, что текст не соответствует указанному в css и вылазит из-за этого за свой блок

[Froggyweb]

Матвей Тепайкин, ты занимаешься непотребным делом прелюдно. Используй нормальный адаптив, при увеличении экрана я сам решу какой размер мне удобней. но да появится скролл горизонтальный. Вообще не понимаю твоих заморочек и решить на свой лад поведение браузеров

[Матвей Тепайкин]

WapSter, залил на сервер. вот ссылка misiktepay.temp.swtest.ru

[Михаил]

Матвей Тепайкин, я тебе открою секрет, но "адаптивность" не значит отображение сайта 1:1 на любом мониторе

[Михаил]

Матвей Тепайкин, ибо, экскюзми, но чо здесь написано?

[WapSter]

Матвей Тепайкин, ты так круто даешь прямые ссылки. Ты уверен, что выбрал ту область?

[Матвей Тепайкин]

Михаил, я понимаю, но такая деформация текст не в какие ворота не лезет. вот только почему не во всех браузерах

[WapSter]

Матвей Тепайкин, calc(1px + 25 * (var(--width-out) / 1920)); Это что за дичь?

[Матвей Тепайкин]

Михаил, деформация видно при изменении масштаба

[Михаил]

Матвей Тепайкин, да она видна даже при ничего не делании

[Матвей Тепайкин]

WapSter, упс, вот та ссылка misiktepay.temp.swtest.ru/furnitureForRestaurants.html?

[WapSter]

Матвей Тепайкин, да я уже код нашел, пока ты там чешешься. ЧТО ЭТО calc(1px + 25 * (var(--width-out) / 1920)); В каком месте там написано 6px?

[Матвей Тепайкин]

WapSter, это уравнение для адаптивного шрифта, не работает и при уравнении и при указании конкретного размера шрифта

[Михаил]

Масштаб 25%

font-size: calc(1px + 23 * (var(--width-out) / 1920));

что дает 36px

ЧОЖ ОНО УЕХАЛО ПАМАГИТИ

[Матвей Тепайкин]

Михаил, да, знаю

[Матвей Тепайкин]

Михаил, чекни с пк!!!

[WapSter]

Матвей Тепайкин, тогда зачем ты тут задаешь этот вопрос? Ты даешь инфу скринами нарушая правила ресурса, отвечающих вводишь в заблуждение предоставляя код не соответсвующий истинному. С браузерами все в порядке. Всего лишь, делает то что автор ему прописал, а не то что автор хочет.

[Матвей Тепайкин]

Михаил, --width-out равна ширине window.outerWidth. ты как считаешь вообще? возьмём за --width-out 500px.
500 / 1920 примерно 0.26, потом умножь на 23 и получишь примерно 6, потом + 1.

[Михаил]

Матвей Тепайкин, чувак ты бредишь, то что ты сделал это полная шляпа, никакой адекватный человек так не сделает

[Матвей Тепайкин]

WapSter, прочти что я тебе выше писал, деформация происходит как при фиксированном значение так и при уравнении

[Матвей Тепайкин]

Михаил, ???????????????

[WapSter]

Матвей Тепайкин, ну ясень пень происходит деформация, браузер пытается увеличить текст, для разрешения нет медиа запросов, и он делает это сам на сколько умеет.

[Матвей Тепайкин]

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

[Матвей Тепайкин]

WapSter, тогда почему хром и эксплорер делает всё нормально? а ?

[WapSter]

Матвей Тепайкин, коофициент увеличение ниже, но делают абсолютно то же самое.

[Матвей Тепайкин]

ну ну

[WapSter]

Матвей Тепайкин, ты умник. Открой страницу со шрифтом 6px и рядом открой массштабированую, и визуально сравни свои 6пх.

[Матвей Тепайкин]

WapSter, если ты не знал, то при изменении масштаба страницы шрифт всегда остаётся примерно такого же размера, если не веришь, проверь через консоль. ты бы открыл хотя бы мой сайт в разные браузерах и сравнил бы их, но нет, тебе же лень. у меня специальное уравнение, которое высчитывает размер шрифта относительно ширины браузера. чё к чему ты возмущаешься по поводу моего уравнения и называешь его хренью? не нравится, предлагай. ты не хочешь даже вникнуть в проблему и при этом отвечаешь. зачем ты вообще впринципе отвечаешь, если не можешь помочь?

[WapSter]

Матвей Тепайкин, ты ошибаешься, я вник и проверил твой сайт в разных браузерах и да в опере шрифт больше, но как я и предположил коэфициент увеличения в разных браузерах разный. Вместо формул люди используют медиа запросы, чтобы не было вот такой дичи. Мне не лень и я как видишь помог многим людям. Но ты откровенно говнокодер, который даже прямую ссылку не смог дать. Написал кучу не нужных комментов, не описал что ты делал все это в масштабировании (мы тут догадались по сути). За то очень хорошо дал понять, что ты довольно глупый человек, на которого в следующий раз не стоит тратить своего времени.

[Матвей Тепайкин]

WapSter, я тебе кучу раз написал, что глюк происходит, даже если указать фиксированное значение. медиа запросы тоже не помогали...

[WapSter]

Матвей Тепайкин, ТЫ НЕ ПОВЕРИШЬ Я СТАВИЛ ФИКСИРОВАННУЮ ШИРИНУ. Мой ответ не изменится. Ты кучу раз не пишешь, а какое-то не не сформулированное говно извергаешь. Пока

[WapSter]

Матвей Тепайкин, да ты и сравнение масштабирования делаешь походу не так. Опера - хром - сафари Масштаб 300%, так как сафари больше не делает, размер шрифта 6пх, отличия минимальные у оперы, о чем это нам говорит смотри ответ выше. Как это сгладить, ответ все там же.

[Матвей Тепайкин]

над увеличением масштаба я ещё не работал. попробуй 25%. косяк, который меня бесит на уменьшении. просто я много чего перепробовал и всё равно не получается решить, уже надоело и несу поэтому всякую чушь, плюс это мой первый сайт, и много чего не знаю. извини за ту грубость и дичь.

Answer 1

[Kirill Makarov]

если используешь SCSS или другие препроцессоры, проверь на вложенность, затем попробуй поставить !important, если это не поможет то есть вероятность что перебивают его inline стили

Comments

[Матвей Тепайкин]

SCSS и другое не использую. inline нету(

[Kirill Makarov]

Матвей Тепайкин, попробуй написать font-size: 6px !important;

[Матвей Тепайкин]

не помогло(