Welcome To Snipplr


Everyone's Recent Snippets Tagged CSS3



This is the new way of creating rounded corners. No images, just 2 lines of code [includes mozilla fix] The two integers are used to set the radius. If they are equal, you can just put it down once.
0 1549 posted 14 years ago by StefanHagen
0 1345 posted 14 years ago by Maux
This snippet will add a linear-gradient atop a background image. With this you'll be able to assign tiling and non-tiling backgrounds with a top-down gradient. The linear-gradient syntax includes the newer, standard -webkit- syntax as well as the old...
0 1317 posted 14 years ago by dtigraphics
Use as follow : .example{ .insetShadow(0, 1px, 5px, rgba(0,0,0, .5)); }
0 1244 posted 14 years ago by kanouf
1 1537 posted 14 years ago by sethetter
CSS3 button with a transparent glass effect (looks better on a textured background). A snapshot can be seen <a href="http://demos.pixelworkshop.fr/misc/css_button.jpg">Here</a>
0 1783 posted 15 years ago by Keliah
2 1943 posted 15 years ago by DADU
1 1360 posted 15 years ago by roflman79
RGBa is a way to declare a color in CSS that includes alpha transparency support. Filter for IE could be add per conditional comment
0 1314 posted 15 years ago by dkl3in
1 2648 posted 15 years ago by alp
1 1540 posted 15 years ago by alp
0 1227 posted 15 years ago by SixteenOne
0 1405 posted 15 years ago by adriano
6 1952 posted 15 years ago by adriano
CSS3 multiple backgrounds with fallback color. For compatibility info see http://caniuse.com/#search=multiple%20background
1 1526 posted 15 years ago by Moonsheeld
1 1490 posted 15 years ago by adambundy
Use as follow in you style.less file : <pre> .example{ .linearGradient(0, #fff, 50%, #ccc, 100%, #fff); } </pre>
1 1680 posted 15 years ago by kanouf
jQuery testing for animating CSS transforms using CSS transitions.
0 1127 posted 15 years ago by martenbjork
Use as follow in your style.less file : <pre> .example{ .rotation(9deg); } </pre>
1 1364 posted 15 years ago by kanouf
0 1312 posted 15 years ago by focal55
0 1274 posted 15 years ago by thesmu
Use the regular box shadow, but add the keyword "inset" as the last parameter. Works in Firefox, Safari, Chrome, Opera and IE9.
0 1245 posted 15 years ago by visudex
1 1542 posted 15 years ago by adambundy
1 1433 posted 15 years ago by ratbagash
This fixes the weird rendering in webkit of rounded corners
0 1320 posted 15 years ago by chippper
<a href="http://nettuts.s3.amazonaws.com/837_shadow/shadow/index.html">View a demo</a>
17 10628 posted 15 years ago by Nettuts