CSS-only RSS badge

Wednesday 5 October 2005This is 19 years old. Be careful.

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:

<a
    href='blog/rss.xml'
    type='application/rss+xml'
    style='
        padding: 0 .4em;
        background: #F60;
        color: white;
        border: 1px solid;
        border-color: #FC9 #630 #330 #F96;
        font-weight: bold;
        text-decoration: none;
        '
    >RSS</a>
» 5 reactions

Comments

[gravatar]
v nice... Dave Winer would be proud :)
[gravatar]
It even renders properly in Blazer on my Treo 650.
[gravatar]
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.
[gravatar]
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:
Comment text is Markdown.