CSS CSS 3

Browser specification for CSS-3

Written by Saiful Islam

Knowledge about browsers is must for better using of CSS3. You need to aware about the statistics of browsers for using perspective. In the world, internet explorer is used mostly, then Mozilla Firefox. So when you design a website then at first you need to look upon Internet Explorer. But all versions of IE do not support CSS3 then you need to hack these browsers. On the other hand safari and android browsers are available for mobile and iPhone versions. So you should aware about these browsers. Look at the picture:

webdesignSo you have noticed that IE6 still is used but IE6 does not support CSS3. You need at least this version for supporting CSS3:

  • IE 7+
  • Firefox 3.5+
  • Chrome 5+
  • Safari 5+
  • Opera 10.6+

How browser works:

   Safari, Chrome:

The rendering engine of Safari and Chrome is same but these browsers are not same. They have same identical level and both use Webkit rendering engine. Both browsers support CSS3 animation and Safari has a full support of 3D transformation. But they are buggy with gradient, multi-columns layout, box layout.

Safari mobile browser Safari iOS3 supports all that are supported by Safari desktop browser. But Safari iOS3 doesn’t support 3D transformation.

   Firefox 4+:

Mozilla Firefox is a very popular browser of the world nowadays. Firefox 4 and 4+ support CSS3 as Safari does. But it has no support of 3D transformation. It uses Mozilla rendering engine to adapt CSS3 drafting properties. It is buggy of box lay out but good in gradient, multi-columns layout. It also supports the calc function.

   Opera 10.6+:

Opera has a majority support of CSS3. It has a better supporting on the transition but buggy in gradients and box layout. It uses presto rendering engine to implement CSS3. The Opera mobile browser has a great supporting of CSS3. It is the only browser that supports calendar, color, date etc. as an input attribute.

   IE 8+:

Most using a web browser is internet explorer. IE 6 has no support of CSS3. IE8+ has support on CSS3. The development work is going for IE. So we expect there is no more delay to support all standard CSS3. IE uses the Trident engine to execute CSS3. Even IE 6 does not support CSS3 but you can force to support these by using some hacking with IE browser hacking or scripting language.

 

Already I have said that all browsers depend on some individual engine for executing CSS3 and here are these references:

Browser Name Engine Name Prefix
Safari, Chrome Webkit -webkit-
Opera Presto -o-
Firefox Mozilla -moz-
Internet Explorer Trident -ms-
Konqueror KHTML -khtml-

 

Why you should use browser prefix:

Although CSS3 is an extension of CSS2 but many properties of CSS3 are in under consideration of W3C. So, all properties of CSS3 do not work in same effective ways. Only standard CSS3 works on all browsers without prefix. In this circumstance, you need to hack by specifying prefix. It is also a test for property how they work under a browser and W3C will consider this to give universality of properties.

You should always use a browser prefix to ensure that all browsers are able to execute CSS3.

About the author

Saiful Islam

2 Comments

  • Hello, i feel that i saw you visited my website thus i came to return the want?.I am trying to in finding issues to enhance my web site!I guess
    its ok to use some of your concepts!!

Leave a Comment