CSS3 Click Chart

Background Clip

Defines how far the background of the element should visibly extend (i.e. where it's "clipped").

Specification

Background Clip on W3C

Example Code

.element {
    background: #d78965;
    padding: 30px;	
    -webkit-background-clip: content-box;
    -moz-background-clip: content-box;
    -ms-background-clip: content-box;
    background-clip: content-box; /* border-box, padding-box */
}

Live Demonstration

This element's background is clipped at the edges of its content.

Desktop Browser Support

IE9+, Firefox 4+, Chrome 4+, Safari 5+, Opera 10.5+

Tools / Polyfills

Tutorials / Articles

Background Clip in CSS3

Fork me on GitHub