html - 将两个div水平居中放置，彼此相邻吗？

我有两个，我需要水平居中，但它们必须彼此相邻。基本上，动态添加的html是一个按钮。这是我的两个代码，并且CSS是内联的，无论尝试如何，我似乎都无法正常工作。如果我使用display：inline-block，我不能让它们彼此并排:(。

<div class="infor-experience col-lg-2 more_info">
  <div class="bottom-add-bid-buttons">
    {% if request.user|isEmployer %}
      <div class="add-to-list" style="float:left; width:300px;">{% include "layout/addtolistmodal.html" %}</div>
      <div class="connect-now bottom" style="width:300px; margin-left:320px;">{% include "layout/bidmodal.html" %}</div>
    {% endif %}
  </div>
</div>

使用此代码，两个按钮彼此相邻，但它们不在水平居中。

谢谢您的帮助！

最佳答案

例如，我已经删除了float:left;并将宽度减小了150px。并将text-align:center赋予父级，将display:inline-block赋予子级

.bottom-add-bid-buttons {
  text-align: center
}
.add-to-list,
.connect-now {
  width: 150px;
  display: inline-block;
  text-align: left;
  border: 1px solid #ddd;
}

<div class="infor-experience col-lg-2 more_info">
  <div class="bottom-add-bid-buttons">
    <div class="add-to-list">div 1</div>
    <div class="connect-now bottom">div 2</div>
  </div>
</div>

关于html - 将两个div水平居中放置，彼此相邻吗？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40858430/