我想display: inline-flex;在块容器中居中两个div ,但不知何故align-items: center;并且justify-content: center;不起作用.只有text-align:center; 有效,但它不应该是那样的(因为我已经阅读过display:inline-flex;它应该是align-items和justify-content)我猜？如果我的解决方案是正确的,那么你能告诉我有什么区别吗？
另外,我想摆脱这两个居中的div之间的那个小差距,但我已经尝试了一些来自互联网的解决方案,但没有一个有效.为什么？
如果你们能帮助我解决我的两个问题,我会很高兴的.
这是代码示例:
.parent {
border: 1px solid blue;
background-color: yellow;
padding: 10px;
}
.container {
border: 1px dotted green;
padding: 10px;
text-align: center;
}
.child, .child2 {
display: inline-flex;
border: 1px solid red;
background-color: honeydew;
padding: 50px;
}<div class="parent">
<div class="container">
<div class="child">
<h1> Test1.</h1>
</div>
<div class="child2">
<h1> Test2.</h1>
</div>
</div>
</div>