using colspan in bootstrap | Sololearn: Learn to code for FREE!


using colspan in bootstrap

can any one explain spanning and colspan of a webpage in bootstrap ?

2/23/2017 5:53:28 PM

Ahmed Sayed

4 Answers

New Answer


assuming that you have the bootstrap files imported correctly <div class="row"> <span class="col-md-4">ele 1</span> <span class="col-md-4">ele 1</span> <span class="col-md-4">ele 1</span> </div> //this should display three things in a row ele |ele |ele | <div class="row"> <span class="col-md-9">ele 1</span> <span class="col-md-4">ele 1</span> </div> //this should push the second element "to a new row" ele | |--end of page |ele | <div class="row"> <span class="col-md-2">ele 1</span> <span class="col-md-2">ele 1</span> </div> ele | ele| --empty-- |--end of page *i have never actually implemented bootstrap so if this does not work i appoligize, however it should.


its seperated into 12 colums. so starting left to right. the first element would have col-sm-3 or something that would leave 9 spaces left so you could use any number of columns that add up to 9, in that row, if it goes over 12 it will push it to the next row. to only use one seperate each element by using class="row" if you want to customize it to have more or less than 12 cols. then you would need to do that before you import it into your project.


@Michael thats awesome thanx so much 😊


could you please give me a simple example ? 😊