1

ダークモード表示にコンポーネントを使用しているWebサイトを開発していますが、600px未満に縮小すると、コンポーネントが縮小しすぎて他のものではなくなります。

私のappjs：

function MyApp({ Component, pageProps }) {
  return (
    <>
      <Head>
        <meta name="viewport" content="initial-scale=1.0, width=device-width" />
      </Head>
      <ThemeChanger>
        <Paper square elevation={0}>
          <Layout>
            <Component {...pageProps} />
          </Layout>
        </Paper>
      </ThemeChanger>
    </>
  );
 }

ここにいくつかのサンプル画像があります:

これは、幅が 700px を超える UI の画像です。

これは、幅が 700px を超える UI の画像です。

これは幅600px未満の写真です

これは幅600px未満の写真です

私がすでに flex 、 min-width を追加しようとしたこと: コンポーネントで「100%」 他のすべてのコンポーネントは、コンポーネントを除いて正常に動作しています

TechStack NextJS v11 Material Ui v5 を使用しています

4

1 に答える 1