Note that there are some explanatory texts on larger screens.

plurals
  1. POCSS3 not working properly on google chrome
    text
    copied!<p>I tried a code on cssdeck : <a href="http://cssdeck.com/labs/ctjasugp" rel="nofollow">Code</a></p> <p>Any changes done to the css are directly reflected on the button but when I try this code an a normal webpage I don't see any change on any browser, not even IE10.</p> <p>What should I do ?</p> <p>This is the code that I tried on my system:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;body&gt; &lt;script type="text/css"&gt; input.gray, a.gray, input[type=submit].gray { padding: 10px 10px; -webkit-border-radius: 2px 2px; border: solid 1px #dadada; background: #f4f4f4; /* Old browsers */ background: -moz-linear-gradient(top, #f4f4f4 0%, #f1f1f1 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f4f4f4), color-stop(100%,#f1f1f1)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f4f4f4 0%,#f1f1f1 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f4f4f4 0%,#f1f1f1 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f4f4f4 0%,#f1f1f1 100%); /* IE10+ */ background: linear-gradient(top, #f4f4f4 0%,#f1f1f1 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#f1f1f1',GradientType=0 ); /* IE6-9 */ color: #555; text-decoration: none; cursor: pointer; display: inline-block; text-align: center; font-weight:bold; font-family:Arial, Helvetica, sans-serif; text-shadow: 0px 1px 1px rgba(255,255,255,1); line-height: 1; font-size:11px; } .gray:hover { border:1px solid #c6c6c4; background: background: #f8f8f8; /* Old browsers */ background: -moz-linear-gradient(top, #f8f8f8 0%, #f1f1f1 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#f1f1f1)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f8f8f8 0%,#f1f1f1 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f8f8f8 0%,#f1f1f1 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f8f8f8 0%,#f1f1f1 100%); /* IE10+ */ background: linear-gradient(top, #f8f8f8 0%,#f1f1f1 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#f1f1f1',GradientType=0 ); /* IE6-9 */ color: #222; -webkit-box-shadow: 0px 1px 1px 0px rgba(10, 10, 10, 0.4); -moz-box-shadow: 0px 1px 1px 0px rgba(10, 10, 10, 0.4); box-shadow: 0px 1px 1px 0px rgba(10, 10, 10, 0.4); } .gray:active { border:1px solid #c6c6c4; color: #222; -webkit-box-shadow: inset 0 0 2px 4px #f1f1f1, 0 1px 0 0 #eeeeee; -moz-box-shadow: inset 0 0 2px 4px #f1f1f1, 0 1px 0 0 #eeeeee; box-shadow: inset 0 0 2px 4px #f1f1f1, 0 1px 0 0 #eeeeee; } &lt;/script&gt; &lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt; &lt;center&gt; &lt;form&gt; &lt;input type="button" value=" Show " class="gray"/&gt; &lt;/form&gt; &lt;/center&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload