Образуются зазоры между border и :after! Как фиксить!?

Question

[yavaman]

Пример ниже по ссылке!
На 1920х1080 зазоров нет, но при масштабировании или изменении разрешения они то и дело появляются. Причём с разных сторон. Подскажите пожалуйста как решить проблему?





https://codepen.io/yavaman/pen/mdPxqMR

Comments

[Антон Литвиненко]

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

[yavaman]

Антон Литвиненко, на Win 10 иногда стоит 125% масштабирование - при таком раскладе зазоры есть.

Answer 1

[bingumd]

border сделайте через :before

Comments

[yavaman]

Спасибо! Хорошее решение, так и сделаю. Но всё же хотелось бы понять почему эти зазоры появляются?

[bingumd]

Вот этого я не знаю...

[Aetae]

yavaman, в firefox такого нет. Да и в chrome не получается повторить. Есть гарантировано воспроизводимый алгоритм? В любом случае если это только в каком-то одном браузере - это баг браузера и надо репортить.