Нужна помощь в решении проблемы с интервалом в содержимом диалога MaterialUI

Я пытаюсь создать сводную страницу и использовать диалог MUI для достижения этой цели.

Вот такой у меня диалог:

Но я пытаюсь сделать так, чтобы две стороны выровнялись вверху вместо того, чтобы было место над «Заголовком 2». Кажется, что типографии добавляются снизу вверх, начиная с последней в каждом div. Использование JSX Im:

<Dialog className = {classes.dialog} open = {open} fullWidth maxWidth = "md">
  <DialogTitle disableTypography className = {classes.dialogTitle}>
    <Typography align = "center" variant = "h5">
      Summary
    </Typography>
  </DialogTitle>
  <DialogContent dividers>
    <div
      className = {
        booleanVar === true ? classes.test1 : classes.test3
      }
    >
      <Typography
        align = "center"
        variant = "h6"
      >{`Title 1`}</Typography>
      <Typography align = "left" variant = "h6">{`Three`}</Typography>
      <Typography align = "left" variant = "h6">{`Line`}</Typography>
      <Typography align = "left" variant = "h6">{`Email:`}</Typography>
    </div>
    {booleanVar === true ? (
      <div className = {classes.test2}>
        <Typography
          align = "center"
          variant = "h6"
        >{`Title 2`}</Typography>
        <Typography variant = "h6">{`Two Line`}</Typography>
        <Typography variant = "h6">{`Example`}</Typography>
      </div>
    ) : null}
  </DialogContent>
</Dialog>

Кроме того, CSS:

const useStyles = makeStyles((theme) => ({
  dialog: {
    borderRadius: "10px",
    height: "auto",
    justifyContent: "center",
    margin: "auto",
    width: "auto"
  },
  dialogTitle: {
    padding: "6px 24px 16px 24px",
    textAlign: "center"
  },
  test1: {
    width: "49%",
    margin: "auto",
    textAlign: "left",
    display: "inline-block",
    paddingRight: "5px"
  },
  test2: {
    width: "49%",
    margin: "auto",
    textAlign: "center",
    display: "inline-block",
    borderLeft: "0.1em solid #e0e0e0",
    paddingLeft: "5px"
  },
  test3: {
    width: "100%",
    margin: "auto",
    textAlign: "center",
    display: "inline-block"
  }
}));

Если кто-нибудь знает решение с помощью CSS, это то, что я предпочитаю, но я открыт для любого рабочего решения!