Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Half columns in Twitter Bootstrap 3

I couldn't figure out how to make the bootstrap column like this:

col 3 | col 4.5 | col 4.5  
like image 828
Nerdar Avatar asked Apr 10 '14 11:04

Nerdar


People also ask

Can you do half columns in Bootstrap?

The long answer is again no, because Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or view port size increases. Rows must be placed within a . container (fixed-width) or . container-fluid (full-width) for proper alignment and padding.

How do I split 3 columns in Bootstrap?

Three Equal ColumnsUse the . col class on a specified number of elements and Bootstrap will recognize how many elements there are (and create equal-width columns). In the example below, we use three col elements, which gets a width of 33.33% each.

How do I split a row into two columns in Bootstrap?

You can use col-md-* class for child element inside the parent row class to split the columns for your need.

What does Col MD 12 mean?

In short, they are used to define at which screen size that class should apply: xs = extra small screens (mobile phones) sm = small screens (tablets) md = medium screens (some desktops) lg = large screens (remaining desktops)


1 Answers

You can try this :

Just split a col-9 in 2 parts.

Bootply : http://www.bootply.com/128927

HTML :

   <div class="col-xs-3">  col-xs-3 </div>    <div class="col-xs-9">       <div class="row">          <div class="col-xs-6">col-xs-4.5</div>          <div class="col-xs-6">col-xs-4.5  </div>       </div>    </div> 
like image 90
BENARD Patrick Avatar answered Oct 22 '22 23:10

BENARD Patrick