Jul 10

Posted in: CSS | 20 Comments

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.

Ordered Lists


View Demo | Download Files


Posted in: CSS | Leave a Comment | 20 Comments
devsnippets- Code snippet Gallery
What others said...

20 Comments, Add Comment or Ping


  1. fikirbozan says:

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

  2. Jacob Gube says:

    Awesome demo!

  3. 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 says:

    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 says:

    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 says:

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

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

  8. Bad Dream says:

    Yep! so cool
    thank you

  9. liam says:

    Sweet stuff,& nice icons :)

  10. Noupe says:

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

  11. Serkan says:

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

  12. Tl7 says:

    nice work there .

  13. Kudos says:

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

  14. Max says:

    Has learnt which the new

  15. Tetsuo says:

    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 says:

    nice collection!

  17. seo says:

    thankss alot
    i will use it

  18. web tasar?m? says:

    cool article, thats very useful thanks,

SPONSORS