1

i have 3 divs in a bootstrap well i want my btn-groups on the same line, the first on the left, the second in the center and the last one on the right

is it possible ? i don't want to use an external CSS file 

<div class="well">
<div>
    Unit of time
    <div class="btn-group">
        <!-- button -->
        <!-- button -->
        <!-- button -->
    </div>
</div>

<div>
    Offset
    <div class="btn-group">
        <!-- button -->
        <!-- button -->
    </div>
</div>

<div>
    Dates padding
    <div class="btn-group">
        <!-- button -->
        <!-- button -->
    </div>
</div>

RomMer
  • 909
  • 1
  • 8
  • 19
  • Why can't you use bootstrap row and column concept? – Maniraj Murugan Apr 26 '17 at 08:16
  • @ManiRaj i'm begginer with bootstrap, it's not my field of expertise – RomMer Apr 26 '17 at 08:18
  • No problem @RomMer , You can learn bootstrap in quick manner and its very easy.. There is a concept called row and columns learn and make use of it.. And also i posted an answer below which is a syntax of row column format.. It is very simple to split up 3 columns and you no need to use any css for seperation.. – Maniraj Murugan Apr 26 '17 at 08:23

2 Answers2

2

You can get it 3 in a row by using bootstrap grid system as like,

  <div class="container">
    <div class="row">
       <div class="col-xs-4>
       </div>
       <div class="col-xs-4>
       </div>
       <div class="col-xs-4>
       </div>
     </div>
   </div>
Maniraj Murugan
  • 8,868
  • 20
  • 67
  • 116
1

Yes it's, you can simply use a grid, by adding each button group in a column, the three button in a row and the whole group inside a container

See an example there : http://getbootstrap.com/css/#grid

awzx
  • 1,023
  • 2
  • 12
  • 31