Useful technology, techniques and stories from modern web development and design
Entries filed under CSS.
A mixin is a named block of declarations you can include wherever you need them, optionally with arguments. The value is not that it saves typing, but that it puts one decision in one place: change the mixin and every element using it changes with it.
Filed under: CSS, SCSS, Showcase, Web Development · Tagged awesome, codepen, creative, css, examples, scss · Permalink
Before scalable icon sets, interface symbols were images, and every size and colour variant was another file to produce and cache. Treating icons as glyphs meant a single dependency could serve a whole interface, scale cleanly, and be recoloured with the same CSS that styles text.
Filed under: CSS, Icons, Web Design, Web Development · Permalink
An animated gradient gives a page movement without loading a video or a sequence of images. The whole effect is colour values changing over time, which costs a fraction of what any media file would.
Filed under: CSS, Javascript, Resources, Web Development · Permalink
For years, layout was built with floats, and a container holding only floated children collapsed to no height at all. The clearfix was the workaround: a generated pseudo-element that cleared the floats and forced the parent to contain them.
Filed under: CSS, Web Development · Permalink