如何水平对齐div中的两个div？

Question

＆＃13;

＆＃13;

<div>
   <div style="float: left; border: 1px solid green;">Left Text</div>
   <div style="text-align: center; border: 1px solid red;">Center Text</div>
</div>

＆＃13;

＆＃13;

＆＃13;

注意：第一个div总是应该在左边。第二个div应位于页面的中心。

Answer 1

如果要将两个内部div水平对齐到父级div，请不要使用float。

尝试添加

display: inline-block;
width: 45%; /* example */

然后text-align：以父母为中心。

Answer 2

虽然我不确定我完全理解你的问题，但我认为这正是你要找的：

＆＃13;

＆＃13;

.container {
  width: 100%;
}
.left {
  float: left;
  width: 25%;
  z-index: 2;
  border: 1px solid green;
  position: absolute;
  top: 8px;
  left: 8px;
}
.center {
  float: left;
  width: 100%;
  border: 1px solid red;
  text-align: center;
}

＆＃13;

<div>
  <div class="container">
    <div class="left">Left Text</div>
    <div class="center">Center Text</div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;