CSS3 & Browser Support

CSS3 is a major development when it comes to web design and creation. There are some impressive innovations with it, but it is severely handicapped by one serious problem. That problem is the issue of CSS3 & browser support.

The Question of Browser Support

Most web designers today would tell you that their ultimate dream would be to create websites fully with the use of HTML5 and CSS3. They can do so right now but only to find out later on that some of the more important properties are not supported by some browsers. One of the biggest culprits of course is the wide spread use of various versions of the Internet Explorer which does not support the language.

But technology is making progress now. Even though it is taking time and doing it ever so slowly, the universal use of CSS3 is soon to become a reality.

Internet Explorer Issues

The biggest browser problem that you would encounter with CSS3 is in connection with IE or to be particular, older versions of Internet Explorer. IE6, IE7 and IE8 are the biggest headaches when it comes to browser support for CSS3. There are very few properties of CSS3 that would be supported by these versions of IE.

    • Less commonly used properties of CSS3 like writing-mode.
    • While opacity is not really supported, there are non-standard ways that you can use it.
    • There are transform properties that you can also utilize for IE.
    • Linear gradients
    • The word-wrap property is supported.

 

That’s about it. Those are the only real properties of CSS3 that can be supported in IE6, IE7 and IE8. There are non-standard ways that other properties can be utilized but since those are not really the ways to utilize those, using those alternative methods could be complicated and troublesome. It could also cause some maintenance problems for the site if you are not careful.

What Modern Browsers Support

For the sake of simplicity everything IE9, Firefox 3.5 and everything else that came after those would be considered as modern. We have here some of the features of CSS3 that are supported by these browsers:

      • media queries
      • border-radius
      • transforms
      • box-shadow
      • RGBA Colors
      • HSLA Colors
      • multiple backgrounds
      • background-clip
      • background-origin
      • background-size
      • box-sizing

 

What’s Supported by Safari, Chrome and Firefox?

There are different properties that would be supported by Safari, Chrome and Firefox which are three major browsers in use today.

        • FlexBox
        • Resizing
        • Multiple Columns
        • Gradients

 

Based on this list alone, you could see that the features of CSS3 that can be supported by the major browsers in use are limited. That places a severe handicap what you can use CSS3 for.

What You Can Do

If you don’t mind the lack of support when it comes to the older versions of IE, you can go ahead and use CSS3 in creating a website. But you have to be aware about which features of it would be supported by certain browsers and which would be not.