Bootstrap, pull-left for small devices

twitter-bootstrap-3

Solution

You can use CSS Media Queries

basic usage will be like this; if you want to float left below devices of width 500px, then

@media (max-width: 500px) {
 .your_class {
    float: left;
  }
}

 @media (min-width: 501px) {
 .your_class {
    float: right;
  }
}

Problem

I'm building a site in Bootstrap 3. Is there anyway to make a element use the class pull-left on smaller devices and use pull-right on larger ones? Something like: pull-left-sm pull-right-lg. I've managed to do it with jquery, catching the resize of the window. Is there any other way? Pref without duplicating the code in a hidden-x pull-left. Or is it considered more ok to duplicate code/content now when going responsive?

Original source

Related problems