CODEWITHSUNDEEP
twitter-bootstraptwitter-bootstrap-3
Randy Minder
Randy Minder

Reputation: 48402

Bootstrap 3 and Media Queries

I'm trying to understand how Bootstrap is using media queries (or maybe I'm trying to understad media queries) to determine how they render content. I picked one of their media queries below. Could someone interpret this for me? My guess is that this means that if the current resolution is 768px or greater, define .col-sm-1 to consume ~8.33% of the width.

enter image description here

Upvotes: 1

Views: 112

Answers (2)

Vinay
Vinay

Reputation: 739

They have 12 such classes .col-sm-12 uses 100%. These classes are not only used for the entire page but will also be applied relatively to the container in which the current element which uses this class is present

Suppose in a DIV of size 200px if you are adding an element with the class as .col-sm-2 then the width of the element is equals to 16.66% of 200px

Upvotes: 0

Alexander Mistakidis
Alexander Mistakidis

Reputation: 3130

Yes, exactly. They're conditional css statements, for things like printing, devices, sizes, etc.

Here's the w3 breakdown of media queries. http://www.w3.org/TR/css3-mediaqueries/

Upvotes: 1

Related Questions