DiggJoin DiggAbout
See the original image at sixrevisions.com —

Innovative (and Experimental) CSS Examples and Techniques

sixrevisions.com — 25 fun, novel, and experimental CSS techniques and demonstrations.

made popular 78 days ago

Digg DudeWhat is Digg?

Digg is a place for people to discover and share content from anywhere on the web. Digg surfaces the best stuff as submitted and voted on by the community.Take the Tour to learn more.

Related by Keyword BETA!

30 Exceptional CSS Techniques and Examples

  • 1885 diggs
  • Made popular 259 days ago
  • 75
  • sixrevisions.com

Textures In Modern Web Design (PICS + EXAMPLES)

  • 693 diggs
  • Made popular 1 day 7 hr ago
  • 25
  • www.smashingmagazine.com

Very Cool CSS Hoverbox Menu Technique

  • 1224 diggs
  • Made popular 2 years 229 days ago
  • 51
  • www.designmeme.com

How are these related stories? Tell us!

show profanity settings
expand all
  • luftegrofnetfo, on 10/23/2008, -3/+22great and interesting resource. thanks!
  • divinediva, on 10/23/2008, -4/+11Great Very Helpful Article.
  • lifeisgoooooood, on 10/23/2008, -6/+10That's awesome. But only masters of CSS can do it.
  • silver26, on 10/23/2008, -1/+13Sticky footer. sweet.
  • JonnyCasino, on 10/23/2008, -0/+10I'm actually thinking of using that solution on a new project. I tested it in IE6, IE7, FF2, FF3, Safari, Opera, Seamonkey on a Win XP machine and it worked perfectly. I don't see how the Sticky Footer is "experimental" just because of it's browser support, though I can see that it's innovative for sure.
    • mtwolf, on 10/23/2008, -0/+5what about chrome?
      • Narcism, on 10/23/2008, -0/+8One webkit browser all you need, pft.
      • theaceoffire, on 10/23/2008, -0/+5Yeah, it works in chrome. However, some of those effects (after the first time you try them) happen so quickly they don't look animated anymore.
      • WMeredith, on 10/24/2008, -0/+2Ah, so that's when speed is bad...
  • akako, on 10/23/2008, -2/+1Those are pretty sweet!
  • UCBrother, on 10/23/2008, -6/+0Awesome.. Nike actually had a sweet CSS site years ago using layers, basically no tables and they really pushed the envelope at the time, I've been using a lot of their same concepts for years now
  • mimodona, on 10/23/2008, -4/+1Amazing
  • FredFredrickson, on 10/23/2008, -2/+9Looks pretty neat, but you always have to be careful with UI design on websites. I don't like forcing people to learn an unfamiliar UI just to navigate my site, and if users get too frustrated by a non-intuitive design, they will simply leave.
    • CrimsonBlur, on 10/23/2008, -0/+6I don't know why you are being buried. All of these examples can be used it interesting ways, but designers need to keep in mind that just because you can do something doesn't mean it is a good idea to actually use it.

      There are too many Websites out there with painfully frustrating navigation that the designer thought was really cool, but users hate. Just because something looks cool, or is hard to do, doesn't mean it works well.
      • FredFredrickson, on 10/23/2008, -0/+3I completely agree. This is one of the reasons why I am glad the phase people went through where they designed entire sites with Flash is over with. I don't like spending 5 minutes every time I visit a site just trying to figure out how to work it.
  • dizzy113, on 10/23/2008, -1/+4pretty cool stuff!
  • tornado42, on 10/23/2008, -8/+0I thought Digg stopped allowing stories about web development.
  • serif69, on 10/23/2008, -2/+4Some of these are pretty cool, but the majority are either poor practice, gimmicky, or just plain rudimentary. A good understanding of how CSS works is all you need to create solid, usable effects.
  • xxAMPLIFYxx, on 10/23/2008, -3/+2Those graphics look too good to be Counter-Strike: Source
  • adrames, on 10/23/2008, -1/+1Mostly impractical. Pretty interesting nonetheless.
  • kcmo08, on 10/23/2008, -0/+8I like seeing tech articles on the front page.
  • Antimatt, on 10/23/2008, -2/+2No ***** way! How did they make that pencil draw the line?!?
    • svivian, on 10/24/2008, -0/+1They just changed the positioning on hover or something.

      The one I wondered about was the animated menu that slid to the right. Then I realised it used animated GIFs, which is cheating.

      Drawing stuff with CSS is stupid though, in most cases you need dozens of small div tags to get any kind of detail. This is what SVG is for.

  • jasminerafique, on 10/23/2008, -4/+1401 Diggs..... WOW!
  • brodiquine, on 10/23/2008, -0/+6Dugg for CSS Homer! OMFG!
  • Dested, on 10/23/2008, -0/+5http://www.cssplay.co.uk/menu/three_d#no

    This is just about the coolest use of css ive ever seen in my entire life EVAR.

    Evar.
  • MeatyVitamin, on 10/23/2008, -2/+2How can you tell I'm not in the web design loop, I thought I was in for some fringe Counterstrike: Source tactics.
  • kevyn, on 10/24/2008, -0/+2homer simpson is amazing
  • scottmckay, on 10/24/2008, -0/+1The text shadow one has issues: http://pxly.org/Zy
    I still would love to see a good cross-browser way to do this.
  • Costess, on 10/25/2008, -0/+0Here's a solution to the 3d puzzle:
    36,31,61,11,51,06,24,20,25,52,12,62,02,46,35,44,41,05,32,54,21,65,63 and finally 33.

    00 being the upper left square.
  •  

    Login or register to add a comment

    Create a new account or login to join in the conversation on Digg. You'll also be able to Digg stories to help promote things you like.


© Digg Inc. 2009 — Content posted by Digg users is dedicated to the public domain.
DIGG, DIGG IT, DUGG, DIGG THIS, Digg graphics, logos, designs, page headers, button icons, scripts, and other service names are the trademarks of Digg Inc.