CODEWITHSUNDEEP
internet-explorercss
nicole
nicole

Reputation: 41

I have an image, that I created with border CSS. However, it's not IE compatible, are there any good alternatives for IE?

I have an image that I created with border CSS. However, it's not IE compatible.

Are there any good alternatives for IE?

#post-wrap {    
    margin:auto;
    padding: 0px 40px 70px 40px;
    width: 850px;
    border-width: 96px 17px 15px 36px;
    -moz-border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;
    -webkit-border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;
    -o-border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;  
    border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;
}

http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png

Upvotes: 1

Views: 240

Answers (2)

Spudley
Spudley

Reputation: 168685

As you already found out, IE doesn't support CSS border-image. If you want to get this kind of effect working in IE, you'll need to use a different method.

The obvious solution is simply to use the image as a background-image instead of a border. This assumes that the image itself if the right size for the element (IE won't scale background images either), and that the element won't change size. If that it the case for you then this is the easiest alternative.

If that isn't the case, then you can still do the same kind of thing, but you'll need to load the image into a foreground context so that IE can scale it, and therefore you'll need to use some additional markup in the shape of an <img> tag, and layer it behind your existing element.

Hope that helps.

Upvotes: 0

Sven Bieder
Sven Bieder

Reputation: 5681

The border-image css3 property is not implemented in IE.

The only possibility is to make a work around with javascript (like the ie-css3.htc or other scripts).

Upvotes: 2

Related Questions