[React]display:blockを指定しているのに縦に並んでくれない

前提・実現したいこと

reactのレイアウトの問題です。
下のコードのようにUSERのdivとSUBMITのdivがあるのですが、それぞれdisplay:blockとしているのにも関わらず、後のSUBMITのコンポーネントの一部がUSERと同じところに残ってしまいます。
理想はこれらのdivを縦に並べたいです。
改善策はありますか？

該当のソースコード

import React from 'react';
import ImageAvatar from './ImageAvatar';
import SelectUser from './SelectUser';
import { makeStyles } from '@material-ui/core/styles';
import Typography from '@material-ui/core/Typography';
import { blue } from '@material-ui/core/colors';
import TextField from '@material-ui/core/TextField';
import Button from '@material-ui/core/Button';
import SimpleCard from './SimpleCard';

const useStyles = makeStyles((theme) => ({
  title: {
    ...theme.typography.button,
    backgroundColor: theme.palette.background.paper,
    padding: theme.spacing(1),
  },
  user: {
    float: 'left',
  },
  userArea: {
    display: 'block',
    backgroundColor: blue[100],
  },
  root: {
    display: 'block',
  },
  submitArea: {
    display: 'block',
  },
}));

export default function App() {
  const classes = useStyles();

  return (
    <div>
      <div className={classes.userArea}>
        <div className={classes.title}>{"USER"}</div>
        <div>
          <div className={classes.user}>
            <ImageAvatar />
            <SelectUser />
          </div>
          <div className={classes.user}>
            <Typography variant="h5" gutterBottom>
            </Typography>
          </div>
        </div>
      </div>
      
     
      <div className={classes.submitArea}>
        <div className={classes.title}>{"Submit"}</div>
        <div>
            <ImageAvatar />
            <SelectUser />
        </div>
        <form className={classes.root} noValidate autoComplete="off">
          <TextField
            id="outlined-multiline-static"
            label="Message"
            multiline
            rows={4}
            defaultValue="Default Value"
            variant="outlined"
          />
          <Button variant="contained" color="primary">
            投稿
          </Button>
        </form>
      </div>
    </div>
  );
}