Jul 10

CSS-Styled Lists: Demo

After seeing the amazing response to our previous post CSS-Styled Lists: 20+ Demos, Tutorials and Best Practices, we wanted to share with you a simple demo we created that showcase some of the most used design blocks created that are differently styled and enhanced give us a nice and clean design blocks using CSS-Styled Lists.

Li20 in CSS-Styled Lists: Demo


View Demo | Download Files

16 Responses, Add Comment +

  1. fikirbozan 10 July 2008

    Ov very good. It is clean and fantastic! Good job

  2. Jacob Gube 10 July 2008

    Awesome demo!

  3. BlackHat Fish 10 July 2008

    It looks weird in FF 2.0.0.12 and i checked it with http://www.shoutingzone.com ‘s htcp tools to find the error online real quick but i couldnt, guess its some styling bug?

    meh great example none the less. thanks for sharing the download

  4. Noupe 10 July 2008

    Thanks everyone, this is just a simple example i wanted to show how we can use these design blocks to display web content in a nice and clean way.

    @BlackHat Fish, i am using FF 2.0.0.15 and it looks fine to me. What is the problem you are seeing in FF 2.0.0.12?

  5. Steve 10 July 2008

    I remember back in the day when Javascript was the preferred method for image rollovers. Thank goodness those days are over. I use as much CSS as possible in my layouts, many of these are definitely in my bag of tricks.

  6. Htoo Tay Zar 11 July 2008

    Great work, Realli thanks, I’ll use this techinque in my future project. Please More CSS tricks & tips.

  7. Craig Farrall 12 July 2008

    Great post, there is plenty in there that I could well use on another project.

  8. Bad Dream 12 July 2008

    Yep! so cool
    thank you

  9. liam 13 July 2008

    Sweet stuff,& nice icons :)

  10. Noupe 13 July 2008

    Yea @Liam, these icons are the Function Icon Set, i thought i mentioned that but i guess i forgot ;)

  11. Serkan 13 July 2008

    Great work,Please More CSS tricks & tips.
    Thanx Greeting from TURKEY..

  12. Tl7 14 July 2008

    nice work there .

  13. Kudos 14 July 2008

    Anything that removes the need for .js gets my vote. Theres an undeniable purity about css problem solving.

  14. Max 21 July 2008

    Has learnt which the new

  15. Tetsuo 22 July 2008

    Nice collection of examples here. I have to say that the CSS is a little messy though, and in a few in instances the HTML used is invalid.

    Still, there’s enough to go at here to tweak the code to make it 100%. Thanks!

  16. bangbouh 26 July 2008

    nice collection!

Trackbacks

Leave a Reply

Comments are moderated – and rel="nofollow" is in use. Please no link dropping, no keywords or domains as names; do not spam, and do not advertise!