text-indent: -9999px; revisited

Turns out, this works even better (and is more concise): .hide-text { text-indent: 100%; white-space: nowrap; overflow: hidden; } As Zeldman put it: Really long strings of text will never flow into the container because they always flow away from the container. Performance is dramatically improved because a 9999px box is not drawn. Noticeably so …

Scaling With em Units

Recently I started testing how proportional scaling of bigger layouts would work in reality and if it makes any sense. It’s possible when using EM units and then changing body’s font-size when viewport’s height grows above certain point. Basically that means, that I have to change only one or two css properties between @media queries …

CSS calc() in Webkit

As mentioned before, CSS calc() was about to come to Chromium/Chrome (Webkit). Since about a week ago, the first part of the implementation has landed into the Canary builds: Adds calc expressions to CSSPrimitiveValue. This enables simple (ie no mixing of percents with numbers/lengths) expressions to be evaluated on most properties. No mixing yet, but …

CSS calc() in Chromium/Chrome

Three days ago this was committed: This is the parsing stage of calc. The expressions are evaluated and expression trees are generated. CSS values are not created yet – that will happen in a subsequent commit. Looking forward to the next commits, as this feature will make things — such as flexible columns with a …

Getting Started with Sass

Great new article on A List Apart introducing on to Sass. While browsers aren’t ready for a new CSS, Catlin and Weizenbaum (the authors of SASS, ed.) realized they could go ahead and design a new style sheet syntax with features to help make their increasingly complex CSS easier to write and manage, then use …