Bootstrap 3 .col-xs-offset-* doesn't work?

Question

I am using bootstrap 3 grid system loved it so far and everything was working well, I am trying to use col-xs-offset-1 and doesn\'t work although .col-sm-offset-1 works. What

Answer 1

Alternatively, you can add an empty div for the xs-offset (would save you having to manage the content in more than one place)

<div class="col-xs-1 visible-xs"></div><div class="col-xs-2">col</div>

The bootstrap devs seem to be refusing to add those xs- ofsets and push/pull classes, see here: https://github.com/twbs/bootstrap/issues/9689

Answer 2

Its not working because col-xs-offset-* is mentioned out of the media query. if you want to use it, you have to mention all the offset (eg: class="col-xs-offset-3 col-sm-offset-2 col-md-offset-1 col-lg-offset-0")

But this is not right, they should mention col-xs-offset-* in the media query

Answer 3

// it works in bootstrap 4, there was some changes in documentation.We dont need prefix col-, just offset-lg-3 e.g.

<div class="row">
   <div class="offset-lg-3 col-lg-6"> Some content...
   </div>
</div>

// here doc: http://v4-alpha.getbootstrap.com/layout/grid/#example-offsetting-columns

Answer 4

Edit: as of Bootstrap 3.1 .col-xs-offset-* does exist, see bootstrap :: grid options

---

.col-xs-offset-* doesn't exist. Offset and column ordering are only for small and more. (ONLY .col-sm-offset-*, .col-md-offset-* and .col-lg-offset-*)

See the official documentation : bootstrap :: grid options

Answer 5

This was really frustrating so I wrote a gist you can grab that enables col-offset-xs-*. I also noticed that Bootstrap SASS repo Bower installed this week did not include col-offset-sm-0 so that is shimmed too but will be redundant in many cases.

Bootstrap 3 xs offset shim

Answer 6

You could get the offset set only for xs devises by negating the higher pixels with 0 offset. Like so,

class="col-xs-offset-1 col-md-offset-0"