CODEWITHSUNDEEP
csstwitter-bootstrap-3
Jon
Jon

Reputation: 6541

css for bootstrap 3 for screens smaller than 767 xs

Using Bootstrap 3 the width of extra small screen is 767px. I want to keep 2 columns till say 600px and then go to one column. Seemingly bootstrap does not have this built in and whatever columns are set for 767px will be the same to 0px.

Nexus 7 for example is about 600px wide. Most phones are 350 wide - http://mydevice.io/devices/. Is 767 a bit wide for extra small?

Seemingly I have to add my own style - xxs, but where can I get the needed width % etc? How would I work out needed width %? Is there a site that can generate the css?

BASED ON @cvrebert ANSWER :

A bootstrap online LESS complier can be found here - http://getbootstrap.com/customize

The @screen-sm variable changes the xs col width.

Upvotes: 1

Views: 526

Answers (1)

cvrebert
cvrebert

Reputation: 9279

One option mentioned in Bootstrap's docs is to change what the boundary between the extra-small (xs) and small (sm) screen sizes is by simply changing the value of the @screen-sm-min LESS variable (which lives in Bootstrap's variables.less file) and then recompiling Bootstrap's CSS.

Upvotes: 1

Related Questions