CSS Head

Atatonic CSS Framework

csshead — Tue, 27 Jul 2010 08:15:15 +0000

Atatonic is a CSS Framework that’s meant to make your web-life easier and is created to provide a stable grid and solid typography…

10 Awesome CSS3 Buttons

csshead — Mon, 26 Jul 2010 10:09:27 +0000

10 awesome and beautiful buttons with CSS3 for you! There are buttons for every kind of website and I think that you will love them! Feel free to use them everywhere…

Word-Wrap: A CSS3 Property That Works in Every Browser

csshead — Thu, 22 Jul 2010 21:42:40 +0000

Okay, this is not exactly the kind of CSS property that’s going to be used in every design. But it is a very useful one when you need it, and some might say it’s much more practical than some of the fluffy new CSS3 features like transitions and whatnot.The property I’m talking about is the CSS3 word-wrap property, and believe it or not, it works in every single browser, including all versions of IE. In fact, it was even supported as far back as IE5…

Understanding CSS3 border-image

csshead — Thu, 22 Jul 2010 19:42:28 +0000

The new CSS3 property border-image is a little tricky, but it can allow you to create flexible boxes with custom borders (or drop shadows, if that’s your thing) with a single div and a single image. In this article I explain how the border-image shorthand property works in today’s browsers…

Semantically Correct Website Logos

csshead — Tue, 20 Jul 2010 11:27:27 +0000

How to mark up your website logo has always been a really controversial topic on the web. There are literally hundreds of articles about the topic and, well, this is another one…

Pure CSS collapsible tree menu

csshead — Thu, 15 Jul 2010 16:05:54 +0000

The classic tree view, we all know it, it’s used everywhere and it definitely can be useful in the right context. I’ve seen various examples about doing it with CSS and they’ve all required JavaScript. Not content with any of those solutions I investigated doing it with pure CSS, I got a good head start from my Custom Radio and Checkbox inputs article. From there I’ve come up with a solution that works pretty well…

Font metrics and vertical space in CSS

csshead — Thu, 15 Jul 2010 14:05:23 +0000

We put a lot of effort into the quality of the fonts in the Typekit library. As part of that work, we’ve been researching the relationship between font math and CSS, and would like to share what we’ve found. If you’ve ever wondered why some fonts look smaller than others at the same typeset size, or why the vertical space between lines of text is such a guessing game, this post is for you…

CSS Webkit Appearance

csshead — Thu, 15 Jul 2010 12:05:00 +0000

I did my fair share of testing this site on an iPad during development. In most cases, the version of Mobile Safari found on the iPad renders pages like any other standards-based browser. Only when I got to native UI elements like search boxes & text fields did I notice an inconsistency. A pre-set styling was being applied in the way of an inner shadow to text input fields and a gradient overlay to search / submit buttons, which also got rounded corners. After picking through Safari’s CSS Reference I found -webkit-appearance, which changes the appearance of buttons & controls to resemble a native apple UI…

Vendor-prefixed CSS Property Overview

csshead — Sat, 10 Jul 2010 09:43:01 +0000

Next to having four seperate pages for the major rendering engines, this page shows a clearer overview of the implemented, prefixed properties, and their counterparts in other engines…

Prefix or Posthack

csshead — Wed, 07 Jul 2010 10:20:32 +0000

As CSS browser support increases, including impressive strides by the IE9 team, more and more authors are plunging into CSS3. As they do so, they’re facing vendor prefixes—the — properties like -moz-border-radius, -webkit-animation, and so on. There’s been some grumbling about these prefixes.

We ought to praise vendors for using prefixes, and indeed encourage them to continue. Beyond that, I hold that prefixes should become a central part of the CSS standardization process. I do this not for the love of repetition, but out of a desire to see CSS evolve consistently. I believe that prefixes can actually accelerate the advancement and refinement of CSS…