material-ui appbar with material-ui-next を使って右や左にフロートさせる正しい方法とは？

質問

material-ui-next ("material-ui": "^1.0.0-beta.22") を使用しながらログイン/ログアウト ボタンを右に浮かせるために正しい方法を使用しているかどうかがわかりません。

を削除したようです。 iconElementRight= を削除したようです。私たちは <Grid> を使わなければならないのでしょうか？なんだか不格好な感じがします。appbarでボタン（例：ログイン）をフロートさせる正しい方法は何ですか？

<AppBar position="static">
      <Toolbar>
        <Grid container spacing={24}>
          <Grid item xs={11}>
            <Typography type="title" color="inherit">
              Title
            </Typography>
          </Grid>

          <Grid item xs={1}>
            <div>
              <HeartIcon />
              <Button raised color="accent">
                Login
              </Button>
            </div>
          </Grid>
        </Grid>
      </Toolbar>
    </AppBar>

どのように解決するのですか？

@Kyle 正解でした :)

は、グリッドコンテナに追加するだけです。

justify="space-between"です。

あなたの例で

<AppBar position="static">
  <Toolbar>
    <Grid
      justify="space-between" // Add it here :)
      container 
      spacing={24}
    >
      <Grid item>
        <Typography type="title" color="inherit">
          Title
        </Typography>
      </Grid>

      <Grid item>
        <div>
          <HeartIcon />
          <Button raised color="accent">
            Login
          </Button>
        </div>
      </Grid>
    </Grid>
  </Toolbar>
</AppBar>