В приведенном ниже коде я бы предпочел никогда не видеть красный фон. Но иногда в некоторых браузерах и при некоторых уровнях масштабирования красный фон создает вид внутренней «границы» вдоль дна, а в некоторых вариантах справа, по сторонам родительского элемента div.
Реальный Ситуация в мире, с которой я начал, конечно, более сложная, но этот простой пример иллюстрирует проблему.
Я поиграл с CSS flex и grid, и многими различными настройками, которые звучат так, как будто они могут решить эту проблему. проблема, но я не нашел надежного решения.
Я могу воспроизвести в Chrome на Ma c и Windows, а на Edge на Windows. Но я не могу воспроизвести на Safari на Ma c. Я еще не пробовал Firefox. Не забудьте поэкспериментировать со многими уровнями масштабирования. Проблема не воспроизводима на всех уровнях масштабирования.
.outer {
background-color: red;
border: solid 1px black;
display: grid;
grid-auto-flow: column;
}
.inner {
background-color: grey;
}
<div class="outer">
<div class="inner">seeing</div>
<div class="inner">red</div>
</div>
Посмотреть на CodePen