我有三个按钮，我想把它们排成一行，它们应该有相等的空间。
例如，我有这样的东西：-
<div class='parent'>
<button class='child'> Button 1 </button>
<button class='child'> Button 2 </button>
<button class='child'> Button 3 </button>
</div>
现在，我想将所有按钮排列在一行中，使其具有相等的空间，这样，如果我将来添加另一个按钮，我就不必担心，每个按钮都将具有相同的空间。
这将起作用。我强烈建议你阅读更多关于flex的内容，因为这对CSS的阻碍至关重要。
.parent {
display: flex;
justify-content: space-between;
}<div class='parent'>
<button class='child'> Button 1 </button>
<button class='child'> Button 2 </button>
<button class='child'> Button 3 </button>
</div>你应该学习Flex。以下是解决方案。。。
.parent {
width: 100%;
display: flex;
justify-content: space-around;
}
.child {
}<div class='parent'>
<button class='child'> Button 1 </button>
<button class='child'> Button 2 </button>
<button class='child'> Button 3 </button>
</div>.child {
display: inline-flex;
margin-right:1.5em;
}
.parent {
display: flex;
}
.child {
flex: 1;
}
上述代码的链接