Material-ui: [Разделитель] Несоответствующая высота на масштабированном экране

@urirahimi Вы заставляете Chrome выполнять вычисление субпикселей, и обычно это ведет себя странно.
Вы можете решить проблему с помощью:

const theme = createMuiTheme({
  overrides: {
    MuiDivider: {
      root: {
        marginTop: 1,
      },
    },
  ),
});

Я попытался изменить реализацию с цвета фона на верхнюю границу, это не помогает.
https://stackoverflow.com/questions/12547580/borders-disappear-in-chrome-when-i-zoom-in

Попробуйте увеличить масштаб браузера до 90 или 100 процентов. Магия

Предостережение: я все еще использую версию 3.9.2 и тестировал только Firefox и Chrome.

Использование thin в качестве толщины границы устранило проблему для меня. Это позволяет браузеру определять толщину. В Chrome thin выбирается равным 1px / zoom . - это означает, что он всегда будет оставаться ровно 1 реальным пикселем независимо от уровня масштабирования. Firefox делает то же самое при уменьшении масштаба, но сделает границу 2 реальных пикселя, когда масштаб> = 200%, 3 реальных пикселя, когда масштаб> = 300% и т. Д. К сожалению, они не ведут себя одинаково, но, по крайней мере, оба вели себя лучше с thin чем с 1px .

const theme = createMuiTheme({
  overrides: {
    MuiDivider: {
      root: {
        // Dividers not consistent when zooming.
        // https://github.com/mui-org/material-ui/issues/14815
        borderTop: 'thin solid rgba(0, 0, 0, 0.12)', //this color should be theme.palette.divider if that is set
        backgroundColor: undefined,
        height: undefined,
      },
    },
  ),
});