Skip to content

Commit

Permalink
Avoid the use of abbreviations for browser names consistently
Browse files Browse the repository at this point in the history
  • Loading branch information
@mathiasbynens
mathiasbynens committed Aug 4, 2012
1 parent d155495 commit 7cdd933
Showing 1 changed file with 29 additions and 29 deletions.
58 changes: 29 additions & 29 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,8 +44,8 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule off]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_round {
-webkit-border-radius: <b g="0">12px</b>; <span class="comment">/* Saf3-4, iOS 1-3.2, Android &le;1.6 <span class="endcomment">*/</span></span>
border-radius: <b g="0">12px</b>; <span class="comment">/* Opera 10.5, IE9, Saf5, Chrome, FF4+, iOS 4, Android 2.1+ <span class="endcomment">*/</span></span>
-webkit-border-radius: <b g="0">12px</b>; <span class="comment">/* Safari 3-4, iOS 1-3.2, Android &le;1.6 <span class="endcomment">*/</span></span>
border-radius: <b g="0">12px</b>; <span class="comment">/* Opera 10.5, IE9, Safari 5, Chrome, Firefox 4+, iOS 4, Android 2.1+ <span class="endcomment">*/</span></span>

<span class="comment">/* useful if you don't want a bg color from <a href="http://tumble.sneak.co.nz/post/928998513/fixing-the-background-bleed">leaking outside</a> the border: */</span>
-moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
Expand All @@ -57,12 +57,12 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule off]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_round {
-moz-border-radius: <b g="0">8px 8px 0px 0px</b>; <span class="comment">/* FF1+ <span class="endcomment">*/</span></span>
-webkit-border-top-left-radius: <b g="1" readonly>8px</b>; <span class="comment">/* Saf3-4 <span class="endcomment">*/</span></span>
-moz-border-radius: <b g="0">8px 8px 0px 0px</b>; <span class="comment">/* Firefox 1+ <span class="endcomment">*/</span></span>
-webkit-border-top-left-radius: <b g="1" readonly>8px</b>; <span class="comment">/* Safari 3-4 <span class="endcomment">*/</span></span>
-webkit-border-top-right-radius: <b g="2" readonly>8px</b>;
-webkit-border-bottom-right-radius: <b g="3" readonly>0px</b>;
-webkit-border-bottom-left-radius: <b g="4" readonly>0px</b>;
border-radius: <b g="0">8px 8px 0px 0px</b>; <span class="comment">/* Opera 10.5, IE9, Saf5, Chrome <span class="endcomment">*/</span></span>
border-radius: <b g="0">8px 8px 0px 0px</b>; <span class="comment">/* Opera 10.5, IE9, Safari 5, Chrome <span class="endcomment">*/</span></span>
}</pre>
<pre class="rule comment commentclose"><span class="comment">/* */</span></pre>
</div>
Expand All @@ -72,8 +72,8 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule off]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_shadow {
-webkit-box-shadow: <b g="0">0px</b> <b g="1">0px</b> <b g="2">4px</b> <b g="3">0px</b> <b g="4" i="lHex" o="sHex">#ffffff</b>; <span class="comment">/* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ <span class="endcomment">*/</span></span>
box-shadow: <b g="0">0px</b> <b g="1">0px</b> <b g="2">4px</b> <b g="3">0px</b> <b g="4" i="lHex" o="sHex">#ffffff</b>; <span class="comment">/* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 <span class="endcomment">*/</span></span>
-webkit-box-shadow: <b g="0">0px</b> <b g="1">0px</b> <b g="2">4px</b> <b g="3">0px</b> <b g="4" i="lHex" o="sHex">#ffffff</b>; <span class="comment">/* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ <span class="endcomment">*/</span></span>
box-shadow: <b g="0">0px</b> <b g="1">0px</b> <b g="2">4px</b> <b g="3">0px</b> <b g="4" i="lHex" o="sHex">#ffffff</b>; <span class="comment">/* Opera 10.5, IE9, Firefox 4+, Chrome 6+, iOS 5 <span class="endcomment">*/</span></span>
}</pre>
<pre class="rule comment commentclose"><span class="comment">/* */</span></pre>
</div>
Expand All @@ -83,8 +83,8 @@ <h1>
<pre class="rule">
.box_gradient {
background-color: <b g="0" i="lHex">#444444</b>;
background-image: -webkit-gradient(linear, left top, left bottom, from(<b g="0" i="lHex">#444444</b>), to(<b g="1" i="lHex">#999999</b>)); <span class="comment">/* Saf4+, Chrome <span class="endcomment">*/</span></span>
background-image: -webkit-linear-gradient(top, <b g="0" i="lHex">#444444</b>, <b g="1" i="lHex">#999999</b>); <span class="comment">/* Chrome 10+, Saf5.1+, iOS 5+ <span class="endcomment">*/</span></span>
background-image: -webkit-gradient(linear, left top, left bottom, from(<b g="0" i="lHex">#444444</b>), to(<b g="1" i="lHex">#999999</b>)); <span class="comment">/* Safari 4+, Chrome <span class="endcomment">*/</span></span>
background-image: -webkit-linear-gradient(top, <b g="0" i="lHex">#444444</b>, <b g="1" i="lHex">#999999</b>); <span class="comment">/* Chrome 10+, Safari 5.1+, iOS 5+ <span class="endcomment">*/</span></span>
background-image: -moz-linear-gradient(top, <b g="0" i="lHex">#444444</b>, <b g="1" i="lHex">#999999</b>); <span class="comment">/* Firefox 3.6-15 <span class="endcomment">*/</span></span>
background-image: -o-linear-gradient(top, <b g="0" i="lHex">#444444</b>, <b g="1" i="lHex">#999999</b>); <span class="comment">/* Opera 11.10+ <span class="endcomment">*/</span></span>
background-image: linear-gradient(to bottom, <b g="0" i="lHex">#444444</b>, <b g="1" i="lHex">#999999</b>); <span class="comment">/* Firefox 16+ <span class="endcomment">*/</span></span>
Expand All @@ -99,7 +99,7 @@ <h1>
<pre class="rule">
.box_rgba {
background-color: transparent;
background-color: <b g="0" i="s2aHex" o="aCh">rgba(180, 180, 144, 0.6)</b>; <span class="comment">/* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 <span class="endcomment">*/</span></span>
background-color: <b g="0" i="s2aHex" o="aCh">rgba(180, 180, 144, 0.6)</b>; <span class="comment">/* Firefox 3+, Safari 3+, Opera 10.10+, Chrome, IE9 <span class="endcomment">*/</span></span>
<span class="ie">filter: <span class="filter">progid:DXImageTransform.Microsoft.gradient(startColorstr=<b g="0" i="s2aHex">#99B4B490</b>,endColorstr=<b g="0" i="s2aHex">#99B4B490</b>)</span>; <span class="comment">/* IE6–IE9 <span class="endcomment">*/</span></span></span>
zoom: 1;
}</pre>
Expand All @@ -110,7 +110,7 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule on]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_rotate {
-webkit-transform: rotate(<b g="0">7.5</b>deg); <span class="comment">/* Saf3.1+, Chrome <span class="endcomment">*/</span></span>
-webkit-transform: rotate(<b g="0">7.5</b>deg); <span class="comment">/* Safari 3.1+, Chrome <span class="endcomment">*/</span></span>
-moz-transform: rotate(<b g="0">7.5</b>deg); <span class="comment">/* Firefox 3.5-15 <span class="endcomment">*/</span></span>
-ms-transform: rotate(<b g="0">7.5</b>deg); <span class="comment">/* IE9 <span class="endcomment">*/</span></span>
-o-transform: rotate(<b g="0">7.5</b>deg); <span class="comment">/* Opera 10.5-12.00 <span class="endcomment">*/</span></span>
Expand All @@ -126,10 +126,10 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule on]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_scale {
-webkit-transform: scale(<b g="0">0.8</b>); <span class="comment">/* Saf3.1+, Chrome <span class="endcomment">*/</span></span>
-moz-transform: scale(<b g="0">0.8</b>); <span class="comment">/* FF3.5+ <span class="endcomment">*/</span></span>
-webkit-transform: scale(<b g="0">0.8</b>); <span class="comment">/* Safari 3.1+, Chrome <span class="endcomment">*/</span></span>
-moz-transform: scale(<b g="0">0.8</b>); <span class="comment">/* Firefox 3.5+ <span class="endcomment">*/</span></span>
-ms-transform: scale(<b g="0">0.8</b>); <span class="comment">/* IE9 <span class="endcomment">*/</span></span>
-o-transform: scale(<b g="0">0.8</b>); <span class="comment">/* Opera 10.5+ <span class="endcomment">*/</span></span>
-o-transform: scale(<b g="0">0.8</b>); <span class="comment">/* Opera 10.50+ <span class="endcomment">*/</span></span>
transform: scale(<b g="0">0.8</b>);
<span class="ie">filter: <span class="filter">progid:DXImageTransform.Microsoft.Matrix(<span class="comment">/* IE6–IE9 <span class="endcomment">*/</span></span>
<b g="0" i="matrix2deg" o="deg2matrix" readonly>M11=0.9999025240093042, M12=-0.013962180339145272, M21=0.013962180339145272, M22=0.9999025240093042</b>,SizingMethod='auto expand')</span>;</span></span>
Expand All @@ -141,8 +141,8 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule on]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_3dtransforms {
-webkit-perspective: <b g="0">300</b>; <span class="comment">/* Saf4+, Chrome 12+ <span class="endcomment">*/</span></span>
-moz-perspective: <b g="0">300</b>; <span class="comment">/* FF10+ <span class="endcomment">*/</span></span>
-webkit-perspective: <b g="0">300</b>; <span class="comment">/* Safari 4+, Chrome 12+ <span class="endcomment">*/</span></span>
-moz-perspective: <b g="0">300</b>; <span class="comment">/* Firefox 10+ <span class="endcomment">*/</span></span>
-ms-perspective: <b g="0">300</b>; <span class="comment">/* IE10+ <span class="endcomment">*/</span></span>
perspective: <b g="0">300</b>;
-webkit-transform: rotateY(<b g="1">180</b>deg); -webkit-transform-style: preserve-3d;
Expand All @@ -158,7 +158,7 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule off]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_transition {
-webkit-transition: <b g="0">all</b> <b g="1">0.3s</b> <b g="2">ease-out</b>; <span class="comment">/* Saf3.2+, Chrome <span class="endcomment">*/</span></span>
-webkit-transition: <b g="0">all</b> <b g="1">0.3s</b> <b g="2">ease-out</b>; <span class="comment">/* Safari 3.2+, Chrome <span class="endcomment">*/</span></span>
-moz-transition: <b g="0">all</b> <b g="1">0.3s</b> <b g="2">ease-out</b>; <span class="comment">/* Firefox 4-15 <span class="endcomment">*/</span></span>
-o-transition: <b g="0">all</b> <b g="1">0.3s</b> <b g="2">ease-out</b>; <span class="comment">/* Opera 10.5–12.00 <span class="endcomment">*/</span></span>
transition: <b g="0">all</b> <b g="1">0.3s</b> <b g="2">ease-out</b>; <span class="comment">/* Firefox 16+, Opera 12.50+ <span class="endcomment">*/</span>
Expand All @@ -172,7 +172,7 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule off]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_textshadow {
text-shadow: <b g="0">1px</b> <b g="1">1px</b> <b g="2">3px</b> <b g="3" i="lHex" o="sHex">#888</b>; <span class="comment">/* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 <span class="endcomment">*/</span></span>
text-shadow: <b g="0">1px</b> <b g="1">1px</b> <b g="2">3px</b> <b g="3" i="lHex" o="sHex">#888</b>; <span class="comment">/* Firefox 3.5+, Opera 9+, Safari 1+, Chrome, IE10 <span class="endcomment">*/</span></span>
}</pre>
<pre class="rule comment commentclose"><span class="comment">/* */</span></pre>
</div>
Expand All @@ -182,7 +182,7 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule off]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_opacity {
opacity: <b g="0">0.9</b>; <span class="comment">/* Chrome 4+, FF2+, Saf3.1+, Opera 9+, IE9, iOS 3.2+, Android 2.1+ <span class="endcomment">*/</span></span>
opacity: <b g="0">0.9</b>; <span class="comment">/* Chrome 4+, Firefox 2+, Safari 3.1+, Opera 9+, IE9, iOS 3.2+, Android 2.1+ <span class="endcomment">*/</span></span>
filter: alpha(opacity=<b g="0" i="fraction" o="percent">90</b>); <span class="comment">/* IE6-IE8 <span class="endcomment">*/</span></span>
}</pre>
<pre class="rule comment commentclose"><span class="comment">/* */</span></pre>
Expand All @@ -194,8 +194,8 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
* {
-webkit-box-sizing: <b g="0">border-box</b>; <span class="comment">/* <=iOS4, <= Android 2.3 <span class="endcomment">*/</span></span>
-moz-box-sizing: <b g="0">border-box</b>; <span class="comment">/* FF1+ <span class="endcomment">*/</span></span>
-webkit-box-sizing: <b g="0">border-box</b>; <span class="comment">/* &lt;=iOS4, &lt;= Android 2.3 <span class="endcomment">*/</span></span>
-moz-box-sizing: <b g="0">border-box</b>; <span class="comment">/* Firefox 1+ <span class="endcomment">*/</span></span>
box-sizing: <b g="0">border-box</b>; <span class="comment">/* Chrome, IE8, Opera, Safari 5.1<span class="endcomment">*/</span></span>
}</pre>
<pre class="rule comment commentclose"><span class="comment">/* */</span></pre>
Expand All @@ -206,8 +206,8 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule off]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_bgsize {
-webkit-background-size: <b g="0">100% 100%</b>; <span class="comment">/* Saf3-4 <span class="endcomment">*/</span></span>
background-size: <b g="0">100% 100%</b>; <span class="comment">/* Opera, IE9, Saf5, Chrome, FF4+ <span class="endcomment">*/</span></span>
-webkit-background-size: <b g="0">100% 100%</b>; <span class="comment">/* Safari 3-4 <span class="endcomment">*/</span></span>
background-size: <b g="0">100% 100%</b>; <span class="comment">/* Opera, IE9, Safari 5, Chrome, Firefox 4+ <span class="endcomment">*/</span></span>
}</pre>
<pre class="rule comment commentclose"><span class="comment">/* */</span></pre>
</div>
Expand All @@ -216,8 +216,8 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule on]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_columns {
-webkit-column-count: <b g="0">2</b>; -webkit-column-gap: <b g="1">15px</b>; <span class="comment">/* Saf3, Chrome<span class="endcomment">*/</span></span>
-moz-column-count: <b g="0">2</b>; -moz-column-gap: <b g="1">15px</b>; <span class="comment">/* FF3.5+ <span class="endcomment">*/</span></span>
-webkit-column-count: <b g="0">2</b>; -webkit-column-gap: <b g="1">15px</b>; <span class="comment">/* Safari 3, Chrome<span class="endcomment">*/</span></span>
-moz-column-count: <b g="0">2</b>; -moz-column-gap: <b g="1">15px</b>; <span class="comment">/* Firefox 3.5+ <span class="endcomment">*/</span></span>
column-count: <b g="0">2</b>; column-gap: <b g="1">15px</b>; <span class="comment">/* Opera 11+<span class="endcomment">*/</span></span>
}</pre>
<pre class="rule comment commentclose"><span class="comment">/* */</span></pre>
Expand All @@ -227,10 +227,10 @@ <h1>
<pre class="rule comment">/* <a class="cb">[to clipboard]</a> <a class="off">[toggle rule off]</a> <span class="endcomment">*/</span></pre>
<pre class="rule">
.box_animation&#58;hover {
-webkit-animation: <b g="0">myanim</b> <b g="8">5s</b> infinite; <span class="comment">/* Saf5, Chrome <span class="endcomment">*/</span></span>
-webkit-animation: <b g="0">myanim</b> <b g="8">5s</b> infinite; <span class="comment">/* Safari 5, Chrome <span class="endcomment">*/</span></span>
-moz-animation: <b g="0">myanim</b> <b g="8">5s</b> infinite; <span class="comment">/* Firefox 5-15 <span class="endcomment">*/</span></span>
-o-animation: <b g="0">myanim</b> <b g="8">5s</b> infinite; <span class="comment">/* Opera 12+ <span class="endcomment">*/</span></span>
animation: <b g="0">myanim</b> <b g="8">5s</b> infinite; <span class="comment">/* Saf5, Chrome, Firefox 16+ <span class="endcomment">*/</span></span>
animation: <b g="0">myanim</b> <b g="8">5s</b> infinite; <span class="comment">/* Safari 5, Chrome, Firefox 16+ <span class="endcomment">*/</span></span>
}

@-webkit-keyframes <b g="0">myanim</b> {
Expand Down Expand Up @@ -295,8 +295,8 @@ <h1>
@font-face {
font-family: '<b g="1">WebFont</b>';
src: url('<b g="0">myfont</b>.eot?#') format('eot'), <span class="comment">/* IE6–8 <span class="endcomment">*/</span></span>
url('<b g="0">myfont</b>.woff') format('woff'), <span class="comment">/* FF3.6+, IE9, Chrome6+, Saf5.1+<span class="endcomment">*/</span></span>
url('<b g="0">myfont</b>.ttf') format('truetype'); <span class="comment">/* Saf3—5, Chrome4+, FF3.5, Opera 10+ <span class="endcomment">*/</span></span>
url('<b g="0">myfont</b>.woff') format('woff'), <span class="comment">/* Firefox 3.6+, IE9, Chrome 6+, Safari 5.1+<span class="endcomment">*/</span></span>
url('<b g="0">myfont</b>.ttf') format('truetype'); <span class="comment">/* Safari 3—5, Chrome4+, Firefox 3.5, Opera 10+ <span class="endcomment">*/</span></span>
}

</pre>
Expand Down

0 comments on commit 7cdd933

Please sign in to comment.