使用material-ui应用程序栏和material-ui-next左右浮动的正确方法是什么? [英] What's the right way to float right or left using the material-ui appbar with material-ui-next?
本文介绍了使用material-ui应用程序栏和material-ui-next左右浮动的正确方法是什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我不知道在使用material-ui-next("material-ui":"^ 1.0.0-beta.22,)
I can't figure out if I'm using the right approach to get the login/logout buttons to float right in while using material-ui-next ("material-ui": "^1.0.0-beta.22",)
似乎他们从api中删除了 iconElementRight =
.我们现在是否必须在应用栏中使用< Grid>
?感觉有点笨拙.在应用栏中浮动按钮(例如登录)的正确方法是什么?
It seems they removed iconElementRight=
from the api. Do we have to use the <Grid>
now in the appbar? It feels kinds of cludgy. What's the right way to float buttons (e.g. login) in the 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您说对了:)
@Kyle You had it right :)
只需添加到网格容器中即可:
just add to the grid container:
justify ="space-between"
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>
这篇关于使用material-ui应用程序栏和material-ui-next左右浮动的正确方法是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文