CSS-only RSS badge

Wednesday 5 October 2005

Sometimes I get stuck obsessing about tiny details. Recently I decided to give my RSS link a standard orange badge. But instead of using an image, I did it with CSS. I’d seen it done before, but I couldn’t find the example I’d seen, so I cobbled it together from some other bits and pieces:


The final code is:

        padding: 0 .4em;
        background: #F60;
        color: white;
        border: 1px solid;
        border-color: #FC9 #630 #330 #F96;
        font-weight: bold;
        text-decoration: none;


markp 8:32 PM on 5 Oct 2005

v nice... Dave Winer would be proud :)

Bob 8:40 PM on 5 Oct 2005

It even renders properly in Blazer on my Treo 650.

Gustaf Erikson 3:00 AM on 6 Oct 2005

nice work fixing that by yourself, I had to crib it:


Leonard Richardson 4:20 PM on 6 Oct 2005

You might have seen it on my web page (where there's now just a text link), or on a NewsBruiser site. I stole the idea from Nick Moffitt.

Ned Batchelder 4:00 PM on 7 Oct 2005

Yeah, it's pretty lame that I'm only getting to it now, and can't even properly credit the bright guys I stole it from! Leonard, you are probably right about it being crummy.com.

Add a comment:

Ignore this:
Leave this empty:
Name is required. Either email or web are required. Email won't be displayed and I won't spam you. Your web site won't be indexed by search engines.
Don't put anything here:
Leave this empty:
URLs auto-link and some tags are allowed: <a><b><i><p><br><pre>.