CSS Mask-Image & Text
# Linked to 3 November 2011, 05:04 in Code by Pat Dryburgh
There are currently 2 webkit CSS properties that I’ve grown to love and hope gain more traction & browser support. My favorite would have to be background-clip:text, but it currently degrades poorly. A close second is mask-image, which you can apply to text.
CSS Drop-Shadows Without Images
# Linked to 8 April 2011, 20:42 in Code by Pat Dryburgh
Drop-shadows are easy enough to create using pseudo-elements. It’s a nice and robust way to progressively enhance a design. This post is a summary of the technique and some of the possible appearances. (via Mark Forscher)
3D Text
# Linked to 6 January 2011, 17:50 in Code by Pat Dryburgh
It is unbelievable to me that this is created entirely with CSS. From Mark Otto: “3D text using nothing but CSS. No extra markup, no :before or :after mess, and no images. Just progressively enhancing CSS to add some flair to your work.”
Flexible Nav
# Linked to 30 December 2010, 16:39 in Links by Levi Figueira
Remember when you needed Flash to create cool navigation menus? Ya, me neither… ;)
List of CSS Cursors for WebKit
# Linked to 1 December 2010, 04:30 in Code by Pat Dryburgh
An in-depth list of CSS cursors (with appropriate examples) for Webkit. I checked the list in Firefox on a Mac, but haven’t checked the site on IE. Still, very helpful for those who require different styles of cursors for their web apps and sites. (via WebKitBits)
JS-less Lightbox Effect in CSS /by @deaxton
# Linked to 9 November 2010, 18:00 in Links by Levi Figueira
Beautiful.
(via @deaxon)
Slick Album Selection Demo with CSS3
# Linked to 9 November 2010, 16:36 in Links by Levi Figueira
(via @pumpkin)
Formalize CSS
# Linked to 18 October 2010, 17:54 in Code by Sam Brown
I want some measure of control over form elements, without changing them so drastically as to appear foreign in a user’s operating system. Thus, my quest to find a happy medium, where browsers would generally agree and let me keep my sanity. The result is what I’m simply referring to as Formalize CSS.
Animated Sprites with CSS3 Transitions
# Linked to 13 August 2010, 11:16 in Code by Sam Brown
Using two familiar CSS techniques you can create animated CSS-only rollovers that degrade gracefully in nonsupporting browsers.
Cross-browser kerning-pairs & ligatures
# Linked to 29 June 2010, 02:43 in Code by Sam Brown
Improved handling of kerning pairs and ligatures in modern browsers using the
text-rendering: optimizeLegibility;declaration.