css中如何把两个div水平居中对齐

在CSS中，想要把两个div水平居中对齐并不难，下面给出两种解决方法。

方法一：使用Flexbox

父元素 {
  display: flex;
  justify-content: center;
}

子元素 {
  margin: 0 10px;
} 

其中，父元素要设置为flex布局，通过设置justify-content为center来使子元素水平居中对齐。子元素需要设置一个左右边距，避免出现紧贴的情况。

方法二：使用文本对齐

父元素 {
  text-align: center;
}

子元素 {
  display: inline-block;
  margin: 0 10px;
} 

像方法一一样，子元素需要设置一个左右边距，但这里是通过display: inline-block来实现的。父元素则通过设置text-align为center来让子元素水平居中对齐。