CSS flexbox justify-self: flex-end 不工作？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/49658425/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
flexbox justify-self: flex-end not working?
提问by mpen
I have a layout where sometimesthe 'left' item is missing. In such cases, I still want the 'right' item to be right-aligned.
我有一个布局，有时缺少“左”项。在这种情况下，我仍然希望“正确”的项目右对齐。
I thought I could do this with justify-selfbut that doesn't appear to be the case.
我以为我可以做到这一点，justify-self但事实并非如此。
Is there a flexbox property for right-aligning one's self?
是否有用于右对齐自己的 flexbox 属性？
.row {
border: 1px solid black;
display: flex;
justify-content: space-between;
align-items: center;
}
.left,
.right {
display: inline-block;
background-color: yellow;
}
.right {
justify-self: flex-end;
}<div class="row">
<!--<div class="left">left</div>-->
<div class="right">right</div>
</div>回答by Nenad Vracar
You could use margin-left: autoon rightelement instead. Also when you use display: flexon parent element display: inline-blockon child elements is not going to work.
你可以使用margin-left: autoon rightelement 代替。此外，当您display: flex在子元素display: inline-block上使用父元素时也不起作用。
.row {
border: 1px solid black;
display: flex;
align-items: center;
}
.left,
.right {
background-color: yellow;
}
.right {
margin-left: auto;
}<div class="row">
<!--<div class="left">left</div>-->
<div class="right">right</div>
</div>