24

In bootstrap v3, the column sizes are declared for different screen sizes.. 

<div class='container'>
    <div class='row'>
        <div class='col-md-6 col-lg-6 col-sm-6'>

I often find myself just needing 1 size for all display types.. and i thought this would be something like

        <div class='col-6'>

where no matter what display size the user is on, just keep the width of the column 6/12 of the grid system.. but this doesn't seem to work. What am I missing?

ZAD-Man
  • 1,328
  • 23
  • 42
BrownChiLD
  • 3,545
  • 9
  • 43
  • 61
  • Your second question should be made into a new question instead of appended here (I now edited it out) – ZAD-Man Jul 16 '14 at 18:04

4 Answers4

31

The correct answer for those sizes is <div class='col-sm-6'>. This will apply to sm and everything larger than it.

However, there is a fourth size - xs - so using <div class='col-xs-6'> would apply to every possible size.

ZAD-Man
  • 1,328
  • 23
  • 42
2

I haven't tested this so it may be wrong. I remember having an issue with col-lg-8 working but when the screen got to medium it all changed. Changing the class to col-md-8 then worked for both.

Using that logic, try setting the class to the smallest you want and see it it inherits upwards.

Lotok
  • 4,517
  • 1
  • 34
  • 44
0

Have you try just: <div class="col-md-6">? Because I think there's not a class col-6 in bootstrap.

AndreFontaine
  • 15
  • 4
0

The prefix xs/sm/md/lg are at wich breakpoints the element snaps to full width. You can see the breakpoints here: http://getbootstrap.com/css/#grid

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */
@media (min-width: @screen-sm-min) { ... }

/* Medium devices (desktops, 992px and up) */
@media (min-width: @screen-md-min) { ... }

/* Large devices (large desktops, 1200px and up) */
@media (min-width: @screen-lg-min) { ... }

So you should be able to use col-xm-6, as it has no breakpoint, or you could make your own class which has 50% width.

ThatsRight
  • 175
  • 7