Welcome To Snipplr


Everyone's Recent CSS Snippets



Each image is positioned, dimensioned, and repeated according to the comma separated values in the other background properties. The images in the list are layered front to back in the same order they are listed in the rule declaration. If a backgroun...
0 1089 posted 11 years ago by COBOLdinosaur
Simple Clearfix
0 810 posted 11 years ago by andrewcolby
Create a subtle "recessed" looking divider line. The example restyles the <hr> tag but it can applied to anything.
1 814 posted 11 years ago by nshakin
Reference a custom font file for use within a stylesheet
0 757 posted 11 years ago by nshakin
Multiple backgrounds
0 660 posted 11 years ago by kickass
Forces padding to not be added to overall box dimensions but instead subtracted - good for frameworks. For example, a container 960px with a 20px border and a 20px padding added still remains 960px allowing me to enjoy my life free of pesky maths....
1 637 posted 11 years ago by kickass
Tested in Firefox 4, Safari 4, Chrome 14, Opera 10, IE 8 (and newer)
0 1063 posted 11 years ago by jntu_gnec
Demo Image: http://i.imgur.com/hTQXYOu.png
0 848 posted 11 years ago by jntu_gnec
Demo Image http://i.imgur.com/f7o3Flr.png
1 1033 posted 11 years ago by jntu_gnec
0 753 posted 11 years ago by scorpayllc
0 721 posted 11 years ago by scorpayllc
0 862 posted 11 years ago by scorpayllc
0 764 posted 11 years ago by scorpayllc
When I got the font from SymbolSet I was really excited to drop it into my interface but found many of the classes did not work. It looked like an encoding issue (since using the in line versions worked). Upon replacing all 570+ UTF-8 characters with...
0 1092 posted 11 years ago by paulprins
Generate numbered classes and apply variable mixins. Base from [http://blog.thehippo.de/2012/04/programming/do-a-loop-with-less-css/](http://blog.thehippo.de/2012/04/programming/do-a-loop-with-less-css/)
0 957 posted 11 years ago by BuschFunker
The CSS text overflow ellipsis solution is perfect for single line truncations. I use this constantly when building mobile or responsive applications.
0 953 posted 11 years ago by chillyjames
Spacing between thead and tbody
0 3212 posted 11 years ago by satie83
-webkit-appearance
0 705 posted 11 years ago by thesmu
designing a simple horizontal tab menu by using ul and il elements with css.
0 975 posted 11 years ago by codingforever99
A toolkit method for responsive development
0 725 posted 11 years ago by fasterhorses
0 711 posted 11 years ago by Alee
One of the great methods to load and work with icons in web pages is to load one image that is a collection of several icons and use any icon as needed, that reduces the number of server request and save bandwidth.
1 1007 posted 11 years ago by codingforever99
CSS to define an iframe to always be 100% of the container it's in.
0 832 posted 11 years ago by leodruker
Using the same code in different browsers can be displayed in different ways. Resetting styles will help you to avoid such problems.
0 949 posted 11 years ago by apphp-snippets
These 2 techniques can be used for alternating row-colors in a table.
0 956 posted 11 years ago by apphp-snippets
Today with CSS3, you no longer need a background image for gradients. You can use CSS to add a gradient to the background of some elements on your page. For ex.: change the color hex values ("84c8d7" and "327fbd") to the gradient color you need.
1 939 posted 11 years ago by apphp-snippets
This solution is based on Mozilla specific CSS extension. Other browsers will ignore this rule.
0 771 posted 11 years ago by apphp-snippets
This can be used in casting shadows off block-level elements like divs, tables etc. (still not supported in IE7 and IE8). Parameters (from left to right): horizontal offset of the shadow, vertical offset of the shadow, blur radius (optional), spread...
1 826 posted 11 years ago by apphp-snippets
Sometimes it's desirable to change a style of the first and/or last elements in a container. You can do this by manually applying classes to your HTML elements: ("last-child" still not supported in IE8).
0 764 posted 11 years ago by apphp-snippets
Uses CSS3 attributes and psuedo elements to create a simple play button for web interfaces.
0 952 posted 11 years ago by devowhippit