Question

我不知道如何使用Bootstrap将2个列表组彼此相邻。

这是我现在拥有的代码。

<div class="container">
         <div class="row">

           <div class="col-sm-3">

            </div>
            <div class="col-sm-9">

              <h2><a class="url" href="#"><strong>Autó adatai:</strong></a></h2>

              <ul class="list-group ticketView">
                  <li class="list-group-item ticketView">
                      <span class="label label-default">Gyártmány</span>
                      <label> Oatmeal</label>
                  </li>
                  <li class="list-group-item ticketView">
                      <span class="label label-default">Modell</span>
                      <label> Cotton</label>
                  </li>  
                  <li class="list-group-item ticketView">
                      <span class="label label-default">Gyártási év/hónap (tól):</span>
                      <label> Mens's 5-10, 8-12</label>
                  </li>
              </ul>

Answer 1

不确定这是不是你问的问题，但这就是我的工作：

<div class="row">
  <div class="col-sm-6 left">
    <ul class="list-group">
      <li class="list-group-item"></li>
    </ul>
  </div>
  <div class="col-sm-6 right">
    <ul class="list-group">
      <li class="list-group-item"></li>
    </ul>
  </div>
</div>

以下CSS：

.left, .right {
  padding: 0;
}
.left .list-group-item {
    border-right: none;
}
.left .list-group-item:first-child {
    border-top-right-radius: 0;
}
.left .list-group-item:last-child {
    border-bottom-right-radius: 0;
}     
.right .list-group-item:first-child {
    border-top-left-radius: 0;
}   
.right .list-group-item:last-child {
    border-bottom-left-radius: 0;
}

这是一个bootply：link

如何在Bootstrap中将2个列表组彼此相邻？

1 个答案: