Размещение карты в центре страницы в React - PullRequest
0 голосов
/ 08 июля 2020

У меня простая проблема с размещением карточки в центре страницы. Я уже ввел alignItems: center и justifyContent: center, но он все еще не отображается на центральной странице.

Отметьте этот код и ссылку НАЖМИТЕ ЗДЕСЬ

КОД

const useStyles = makeStyles(() => ({
  root: {
    minWidth: 275,
    justifyContent: "center",
    alignItems: "center"
  },
  cardHeader: {
    backgroundColor: "blue",
    color: "white",
    display: "flex",
    justifyContent: "center",
    alignItems: "center"
  }
}));

1 Ответ

1 голос
/ 08 июля 2020

Вы можете использовать flex для родительского элемента, обратите внимание, что вам нужно установить height, чтобы он соответствовал центру.

const useStyles = makeStyles(() => ({
  root: {
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    height: "100vh"
  },
  cardHeader: {/*...*/}
}));

Редактировать демо материала

...