Hello Readers,

As we all knows that The CSS3 property allows you to add depth to your website's design without the need for images or extra container elements but when we use these property.

For Css3 it is vital that it works on all browser i.e it should be cross browser scripting, Therefore it becomes very important that we use proper Css3 Property, prefixes and avoid minor mistakes such as syntax & incomplete property.

Prefix for Cross browser
Firefox Supports use of -moz prefix
Google Chrome, Opera, Apple Safari Supports use of -webkit prefix
IE9 Supports us of -ms-

Below is the example how to use proper syntax & property.

Here is the HTML

<div class="round">
    Use of Prefix
</div>

Here is the CSS

*{
            padding: 0px;
            margin: 0px;
        }

        .round{
            width:200px;
            padding:10px 15px;
            color:#fff;
            font-size:18px;
            margin: 10px auto;
            text-align: center;
            border-radius: 5px;
            -webkit-border-shadow: 5px;
            -moz-border-shadow:    5px;
            box-shadow: 1px 1px 6px 0 rgba(10, 10, 10, 1);
            -webkit-box-shadow: 1px 1px 6px 0 rgba(10, 10, 10, 1);
            -moz-box-shadow:    1px 1px 6px 0 rgba(10, 10, 10, 1);
            background: #1e5799; /* Old browsers */
            background: -moz-linear-gradient(top,  #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%); /* FF3.6+ */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
            background: -webkit-linear-gradient(top,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
            background: -o-linear-gradient(top,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Opera 11.10+ */
            background: -ms-linear-gradient(top,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* IE10+ */
            background: linear-gradient(to bottom,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* W3C */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
        }