Testing the real-world difference between inline and grouped media queries

As I'm arguing that the difference between media queries grouped together and those written inline is so negligible as to be irrelevant, I'd better back that up with a little empirical evidence.

To illustrate the point, indulge me in a simple test. By the end of this chapter, there are 20 media queries defined inline for the http://sassandcompass.com site we are building.

First of all, uncompressed, the file size of the CSS itself is 14.1 KB (14,145 bytes).

If that uncompressed CSS file is gzipped, the file size comes down to 3 KB (3,058 bytes).

Let's back up and compress that CSS with Sass (using the output_style = :compressed option in the config.rb file). At this point, ...

Get Sass and Compass for Designers now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.