CSS3 Border Image Experiment

So, I was responsible for explaining the CSS style border-image during a presentation to coworkers. During research I came across this post. The article was informative but I needed a demo, and a nice one was linked to in that same article. Though I needed it to be a bit more extensive, so I revamped it to explain the complexities of border-image and 9-slice scaling in very visual, interactive, and complete way.

The demo can be found HERE.

Tested in Safari 5+, Chrome 10+, Firefox 4+
‘Should’ also work in Opera and Internet Explorer 10, but don’t be upset if it doesn’t.


Posted

in

by

Tags:

Comments

3 responses to “CSS3 Border Image Experiment”

  1. Alexey Avatar
    Alexey

    This demo works only in Chrome.

    1. jimisaacs Avatar
      jimisaacs

      And Safari, so what you meant to say was, "only works in WebKit". Yes, I know this is the case, but you are more than welcome to make it work in Firefox and IE. Like I said, it was for a presentation, not open source code sharing. I do agree that I should make note of it in the post, thanks.

    2. jimisaacs Avatar
      jimisaacs

      Ok I went ahead and made it work in FF and company 😉

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.