HTML and CSS Reference
In-Depth Information
Another and perhaps better example is the 12-column grid system in
inuit.css. By default, the framework uses a 16-column grid, with
classes
.grid-1
through
.grid-16
for each size of column.
A problem arises, though, when you attempt to switch from the 16-column
system to the 12-column system. The
.grid-15
class, for example, doesn't
exist in a 12-column layout; and even if it did, it would be too big.
What I did here was to make
.grid-13
through
.grid-16
use the exact
same properties as
.grid-12
. So, if you switch from a 16-column layout to
a 12-column one, your
.grid-13
through
.grid-16
would't break it — they
would all just become
.grid-12
s.
This means that developers can switch between them, and inuit.css will take
care of everything else.
Pre-empt the developer's next problem, and solve it for them.
Addendum
A few people have mentioned that some of these practices lead to a bloated
CSS file. Bloat is where
unnecessary
code makes its way into a file, and your
comments should be anything but unnecessary. It
will
lead to a larger CSS
file, but not a bloated one.
If you are worried about increased file size then you should minify and gzip
your stylesheets, but this is best practice (particularly for highly tra
!
cked
websites) anyway.
