Community Project: Description List Results!

Community Project: Description List Results!

Nice work people! Loads of you have gone away and experimented with styling a straight-forward Description List – take a look at the results..


The Challenge

I asked you all to style this markup..

<dl>
    <dt>Psdtuts+</dt>
    <dd>Adobe Photoshop Tutorials from Beginner to Advanced.</dd>
    <dt>Nettuts+</dt>
    <dd>Web development Tutorials, from Beginner to Advanced.</dd>
    <dt>Webdesigntuts+</dt>
    <dd>In-depth tutorials and articles on web design.</dd>
    <dt>Wptuts+</dt>
    <dd>A WordPress Website dedicated to WordPress training, tutorials, and WordPress videos.</dd>
</dl>

..using whatever magic you could muster with CSS alone. Here are the results!


A Couple of Examples

You’re welcome to continue submitting ideas for this, but there’ll be another challenge coming soon. In the meantime, check out a few of the submissions which most caught my eye:


Vince’s Factory – by Vincent Markesteijn

Just circles – by Niels Voogt

Clean DL – by Sam Markiewicz

Borderlands 2 – by Chris Spittles

Personal Disclaimer

There’s a chance I somehow missed your submission, messed up your name, copied the wrong url to your own site, ruined something I haven’t even thought about – if that’s the case, just shout at me in the comments and I’ll see about setting things right. If you didn’t include your details in the css file, they ain’t there..

Other than that, enjoy everyone’s work and leave constructive advice, questions and thoughts in the comments below. Thanks to all who participated – here’s to many more Webdesigntuts+ Community Projects!

Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
  • http://www.rafalborowski.com Rafal Borowski

    Love the “Just circles”. Nice job.

  • http://richardmisencik.com Richard

    Vince’s Factory and Just circles are the best ones! Good work!

  • Mesame

    This one takes the cake for me — it’s relatively simple yet very playful! Excellent work!

    • Mesame

      …eh, I was specifically referring to “Rafal”.

      • http://www.rafalborowski.com Rafal Borowski

        Thank you :) Glad someone like it.

  • http://joelmturner.com Joel Turner

    There are some great submissions here! I love the just circles, very clean. Another great community project!

  • Mesame

    The text transforms match the theme. Very stylish!

    • Mesame

      …and this comment was referring to “Borderlands 2″.

  • http://www.paul-sproat.co.uk Paul Sproat

    Sweet! I made the list!

    I enjoyed this little project, Thanks guys.

  • http://team.synlight.net/ Martin Helmut Fieber

    Good job! Some of them are really cool.

  • http://artwonder.ru Anton

    Awesome! Some works are blow my mind – amazing! I really like ur idea about Community Projects – It’s a really good way to spice up some creativeness and experiment with new huge possibilities of CSS3! Thank you! :)

  • Dougieladd

    Hi Ian, I enjoyed this project. Very simple and yet there are some amazing submissions. And it was nice to see mine in there too. One thing though, I’ve just tried to download my favourite one “Just circles” and I get an “access denied” dead link. Is it just me? Or is anyone else having problems downloading them? It’s not just that one either. Anyway, thanks again, great project. :)

    • http://www.snaptin.com Ian Yates
      Author

      Sorry about that – some of the zip files hadn’t uploaded.. Try again, they should all be there now :)