Submit a CSS related link →

Posh CSS

For the modern day web designer.

How to Create Inset Text with CSS3

# Linked to 22 October 2009, 13:46 in by Sam Brown

We are going to use the text-shadow property that is currently supported by Firefox, Opera and Safari to create the appearance of inset text. Inset text being text that has been pushed into the background, almost like a reverse embossed effect.

Read more at stylizedweb.com →

Pure CSS Text Gradient (No PNGs)

# Linked to 22 October 2009, 04:31 in by Mark Otto

Tim Brown shows us how to apply a gradient to any HTML text element using nothing more than CSS (that’s right, no images!) in Safari through a combination of @font-face, text-shadow, Webkit gradients, and Webkit masks.

Read more at nicewebtype.com →

Accessible, Custom Designed Checkbox and Radio Button Inputs Styled with CSS (and a dash of jQuery)

# Linked to 22 October 2009, 00:29 in by Kevin Holesh

Whew, what a title! This method for adding custom styles to checkboxes and radio buttons is the best I’ve come across yet because of its degradability. When JavaScript is enabled, users see custom input checkboxes and radio buttons as shown below; when users are browsing with JavaScript disabled or with a screen reader, they simply interact with standard, unstyled input elements.

Read more at www.filamentgroup.com →

Customized Form Elements with CSS and Javascript

# Linked to 21 October 2009, 16:52 in by Pat Dryburgh

Have you ever wanted to use your own images for checkboxes, radio buttons or select lists? This script will let you do that. Easily.

Read more at ryanfait.com →

Browser support for CSS3 and HTML5

# Linked to 20 October 2009, 20:50 in by Sam Brown

I thought people mind find it useful to know the state of support in the current browser market. I’ve taken all the A-Grade browsers and tested them one-by-one for their feature support . Needless to say it’s produced some interesting results.

Read more at www.deepbluesky.com →

Clickable List Item

# Linked to 20 October 2009, 16:34 in by Kevin Holesh

Making an entire list item clickable (instead of just the actual text) is an easy way to improve usability. All it takes is a couple simple CSS rules.

Read more at iloveusability.com →

Purely CSS – Faking Minimum Margins

# Linked to 20 October 2009, 16:25 in by Kevin Holesh

Sadly, min-margin is nonexistent in the CSS world. I was okay with that – until recently, when I realized I needed it. After a fair share of general thought and Google usage, I arrived upon a solution, which I invite you to check it out.

Read more at buildinternet.com →

Top Reasons Your CSS Columns Are Messed Up

# Linked to 20 October 2009, 15:55 in by Mark Otto

An oldie, but a goodie, Kyle Neath sums up all you need to know about quickly and effectively creating column layouts for with CSS. Create your own CSS framework in time by understanding how to use negative margins and self clearing floats with divs or list items.

Read more at warpspire.com →

Mastering CSS Coding: Getting Started

# Linked to 20 October 2009, 12:50 in by Ross Chapman

If you are getting your feet wet with CSS, this is the perfect time to fire up your favorite text editor and follow along in this tutorial as we cover the most common and practical uses of CSS.

Read more at www.smashingmagazine.com →

Greyscale Hover Effect w/ CSS & jQuery

# Linked to 20 October 2009, 12:48 in by Ross Chapman

A few months ago, James Padolsey introduced a cool greyscale technique for non-IE browsers. His technique inspired me to come up with a workaround with a similar effect.

Read more at www.sohtanaka.com →