Material-ui: [Pembagi] Tinggi tidak konsisten pada layar yang diskalakan

@urirahimi Anda memaksa Chrome untuk melakukan penghitungan subpiksel, dan ini biasanya memiliki perilaku yang aneh.
Anda dapat mengurangi masalah dengan:

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

Saya telah mencoba mengubah implementasi dari warna background ke border top, itu tidak membantu.
https://stackoverflow.com/questions/12547580/borders-disappear-in-chrome-when-i-zoom-in

Cobalah untuk meningkatkan zoom browser hingga 90 atau 100 persen. Sihir

Peringatan: Saya masih menggunakan versi 3.9.2 dan hanya mengujinya di Firefox dan Chrome.

Menggunakan thin sebagai ketebalan perbatasan memperbaiki masalah bagi saya. Ini memungkinkan browser menentukan ketebalan. Di Chrome thin dipilih menjadi 1px / zoom . - artinya itu akan selalu tetap tepat 1 piksel nyata terlepas dari tingkat pembesaran. Firefox melakukan hal yang sama saat memperkecil, tetapi akan membuat batas 2 piksel nyata ketika> = 200% zoom, 3 piksel nyata ketika> = 300% zoom dll. Sayangnya mereka tidak berperilaku sama, tetapi setidaknya keduanya berperilaku lebih baik dengan thin daripada dengan 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,
      },
    },
  ),
});