box-sizing: padding-box на Chrome

Пока Хром не поддерживает данное значение атрибута спецификации CSS, что то надо делать!

Можно отказаться, но удобно ведь?

Самый простой выход написать вместо злополучного экспериментального padding-box:

Во всех случаях, когда

Это работает точно также.

Народ пробует также городить что то вроде:

но хрому то до лампочки :). Так что пока будем пользовать border-box.

Мало букафф? Читайте есчо !

Анимация: Поднятие элемента с тенью при наведении

Апрель 26, 2025 г.

Эта анимация создаёт эффект, будто элемент "приподнимается" над страницей, становясь более заметным. Обычно для этого используется свойство box-shadow, иногда в сочетании с лёгким смещением (transform: translateY(-2px)). Это статья из цикла заметок ...

Читать

Как сделать чтобы scss mixin добавлял стили однократно

Март 29, 2025 г.

Иногда требуется, чтобы стили или часть стилей, формируемых миксином, добавлялись однократно. Например, ваш миксин добавляет анимацию и при этом объявляет блок @keyframes, который не зависит от параметров и для всех анимированных блоков одинаков. ...

Читать

Позиционирование фона с помощью background-position

Май 3, 2018 г.

В CSS, для позиционирования фонового изображения в контейнере, мы используем свойство background-position. Свойство можно задать отдельно для оси X и Y,  кроме того можно задать 2, 3 или 4 параметра. Классический случай - позиционирование с ...

Читать

Квантование ширины: способ балансировать текст в кнопках на CSS

Сентябрь 25, 2025 г.

Иногда кнопки на сайте содержат очень разный по длине текст. С коротким текстом всё просто: он помещается в одну строку и выглядит аккуратно. Но как только ...

Читать
 

Комментарии к «box-sizing: padding-box на Chrome»

Понравилась статья? Есть вопросы? - пишите в комментариях.



Комментарий: