Sunday, August 11, 2013

Different @media Breakpoints for Twitter Bootstrap

What you see below is the actual CSS in action, resize the window to display each size breakpoint. (source) This CSS is exactly the same as Twitter Bootstrap. Useful to use in your own CSS in addition to Bootstrap, or as a standalone to detect different devices. Using the pixel density is generally a bad idea as laptops move into the higher densities.

type A (Mobile)

type B (Tablet/Mobile)

type C (Small Desktop)

type D (Desktop)

No comments: