CSS tab-size
The ridiculous tabs vs. spaces debate within code can get just as heated as the JavaScript semi-colon debate. I'm a tab guy myself but to each their own...just don't work on a project with me if you aren't. Anyways, I was quite surprised to find that you can set the tab space number of <pre> element code with CSS's tab-size property!
The CSS
The tab-size property takes an integer value representing the number of spaces a tab represents:
/* 4 spaces per tab */
pre {
tab-size: 4;
}
/* No indentation */
pre {
tab-size: 0;
}
As you can see, you could even remove indentation all together. Not recommended but possible.
I love this property as it's especially useful for code-heavy blogs, though it doesn't have much use outside of that.
![CSS 3D Folding Animation]()
Google Plus provides loads of inspiration for front-end developers, especially when it comes to the CSS and JavaScript wonders they create. Last year I duplicated their incredible PhotoStack effect with both MooTools and pure CSS; this time I'm going to duplicate...
![7 Essential JavaScript Functions]()
I remember the early days of JavaScript where you needed a simple function for just about everything because the browser vendors implemented features differently, and not just edge features, basic features, like addEventListener and attachEvent. Times have changed but there are still a few functions each developer should...
![Vertically Centering with Flexbox]()
Vertically centering sibling child contents is a task we've long needed on the web but has always seemed way more difficult than it should be. We initially used tables to accomplish the task, then moved on to CSS and JavaScript tricks because table layout was horribly...
![Implement the Google AJAX Search API]()
Let's be honest...WordPress' search functionality isn't great. Let's be more honest...no search functionality is better than Google's. Luckily for us, Google provides an awesome method by which we can use their search for our own site: the Google AJAX Search API.
Didn’t know about that.
It’s so basic that I wouldn’t be surprised if that was defined in CSS1.
But it’s a recent thing it seems, and still vendor prefixed. No sign of support in IE, as Microsoft stubbornly thinks that tabs are as huge as 8 spaces!
For vendor prefixes and browser support comparison: https://developer.mozilla.org/en/docs/CSS/tab-size