css - 将 Material UI 按钮放置在行的最右侧

Question

尝试将此 React Material-ui 按钮与页面的最右侧对齐，但似乎无法正常工作:

    <Grid item justify="flex-end">
      <Button              
        variant="contained"
        color="primary"
        onClick={() => myFunction()}
      >
        Submit
      </Button>
    </Grid>

已尝试 justify="flex-end" 但似乎不起作用。

Answer 1

这段代码对我有用。

<Box display="flex" justifyContent="flex-end">
  <Button              
    variant="contained"
    color="primary"
    onClick={() => myFunction()}
  >
    Submit
  </Button>
</Box>

如果你想使用Grid，请使用这样的内联样式。

 <Grid item style={{display:"flex"}} justify="flex-end">
          <Button              
            variant="contained"
            color="primary"
            onClick={() => myFunction()}
          >
            Submit
          </Button>
</Grid>