Spacing with bootstrap columns

Asked

Viewed 7,444 times

2

Studying the official website, I saw that the cool-Xs-offset was implemented only from the version 3.0.1, thus includes the version 3.0.3 on my website.

Problem

What happens is when I apply the Xs-offset (as an example below), it also applies this offset to other devices. It would not be possible to apply only to XS ?

<div class="col-xs-offset-2 col-xs-8 col-sm-4">
  • You can add an example of the problem?

  • William, the examples are in the topic. What happens is that he considers this spacing for all devices and not only to 'XS''

  • Hello James. As in the case of William also could not understand the problem. You could create a Fiddle and share the link demonstrating the problem to us? To use Bootstrap simply include http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css. on External Resources.

  • Come on. There is no way I can put the example in the correct way, because in jsfiddle it already recognizes the space used as being an 'XS' device, so there is no way I can put together the desired example http://jsfiddle.net/N7nrE/ . The only thing I would like is for the offset of the Xs not to interfere with the offset of the Sm, Md and lg.

  • I made an example codepen. I didn’t detect the problem, but I used the latest version: 3.1.1 http://cdpn.io/diubq

2 answers

2

You don’t have to put:

<div class="col-xs-offset-2 col-sm-offset-0 col-md-offset-0 col-lg-
offset-0 col-xs-8 col-sm-4">

Just put once the offset-0 which goes by inheritance until the end. Would look like this:

<div class="col-xs-offset-2 col-sm-offset-0 (a partir daqui o "0" fica igual para md e lg) 
col-xs-8 col-sm-4">

1


'Solution'

I was able to solve the problem just by applying the other offset, this is correct ?

<div class="col-xs-offset-2 col-sm-offset-0 col-md-offset-0 col-lg-offset-0 col-xs-8 col-sm-4">
  • Like you said, it’s a solution too, not that it’s the right one, because it was supposed to work for xs just... One question, you happened to change the container size?

Browser other questions tagged

You are not signed in. Login or sign up in order to post.