尝试使用bootsrap css向左中心和右侧浮动三个div

时间:2016-08-16 13:01:54

标签: html css twitter-bootstrap

我试图将三个div放到左中心和右边,并且应该全部水平相同。这是我的尝试:

HTML

//to be centered div
<div style="float:center">

    <form>
    </form>

    <form>
    </form>

</div>
//to be floated to the left
<div style="float:left" id="active-container" class="row">
    <div class="col-lg-1 col-centered">
        <p style="color:#fff; font-size:15px;"><strong>FLOATED TO THE LEFT </strong></p>

        <div id="active_users">
        </div>


    </div>
</div>

//to be floated to the right
<div style="float:right" id="engaged-container" class="row">

    <div class="col-lg-1 col-centered">
        <p style="color:#fff; font-size:15px;"><strong>FLOATED TO THE RIGHT </strong></p>

        <div id="engaged_users">
        </div>

    </div>
</div>

CSS

.col-centered {
  float: none;
  margin: 0 auto;
}

我的挑战是三个div漂浮到左侧,中间和右侧,但它们从未在该位置开始,只有左侧和右侧div处于同一位置。

请问如何将三个div浮动到左中心和右边,并从使它们水平对齐的相同位置开始。

0 个答案:

没有答案