在一行中对齐div，极左、中、极右。

Question

我主要有3个div在父类wrapped_inside下。我想对齐所有的3个div在一排。其中一个在两个中间部分，在最左端和右端。下面的代码在除IE之外的所有浏览器中都能正常工作。

请注意，下面的css和html页面是更大的html的一部分。我只复制了下面的演示示例的重要部分。

​

.wrapped_inside div:nth-child(3) {
  position: relative;
  display: block;
}
.wrapped_inside div:nth-child(3) div:nth-child(1) {
  float: left;
  padding-top: 5px;
}
.wrapped_inside div:nth-child(3) div:nth-child(2) {
 padding: 10px;
  position: absolute;
  left: 50%;
}
.wrapped_inside div:nth-child(3) div:nth-child(3) {
  // left: 0%;
  float: right;
  padding-top: 5px;
}

<div class="wrapped_inside">
  <div class="arw"></div>
  <div class="arw"></div>
  <div class="arw">
    <div class="type-4">
      <div  id="one">footer text1</div>
    </div>
    <div class="type-2">
      <div class="two">
        <a href="javascript:void(0)">
          <span >text2
        </span>
        </a>
      </div>
    </div>
   <div class="type-6">
      <div >
            <a href="#">
              <span class="menu-left">0</span>
            </a>
        
      </div>
    </div>
  </div>
</div>

​

Answer 1

删除此div <div class="col-sm-6"></div>

​

.wrapped_inside div:nth-child(3) {
  position: relative;
  display: block;
}
.wrapped_inside div:nth-child(3) div:nth-child(1) {
  float: left;
  padding-top: 5px;
}
.wrapped_inside div:nth-child(3) div:nth-child(2) {
 padding: 10px;
  position: absolute;
  left: 50%;
}
.wrapped_inside div:nth-child(3) div:nth-child(3) {
  // left: 0%;
  float: right;
  padding-top: 5px;
}

<div class="wrapped_inside">
  <div class="arw"></div>
  <div class="arw"></div>
  <div class="arw">
    <div class="type-4">
      <div  id="one">footer text1</div>
    </div>
    <div class="type-2">
      <div class="two">
        <a href="javascript:void(0)">
          <span >text2
        </span>
        </a>
      </div>
    </div>        
    <div class="type-6">
      <div >
            <a href="#">
              <span class="menu-left">0</span>
            </a>
        
      </div>
    </div>
  </div>
</div>

​