CSS clip Property
CSS clip property specifies the clipping region for an absolutely positioned element.
The clip property does not work if overflow: visible.
Usages
The following table outline the usages and version history of this property.
| Default value: | auto |
| Applies to: | Absolute Positioned elements |
| Inherited: | No |
| Version: | CSS2 |
| JavaScript Syntax: | object.style.clip = "rect(0px, 60px, 180px, 20px)" |
Syntax
Here is a syntax for the CSS clip property
clip: auto | shape | initial | inherit;
Property Values
The following table describes the values of this property.
| Value | Description |
|---|---|
| auto | Default. The element does not clip |
| shape | The element should be clips on valid shape. A shape value is: rect(top, right, bottom, left) |
| initial | Sets default value of this property |
| inherit | Inherits this property from its parent element |
Examples
The example below shows to sets float property.
img {
position: absolute;
clip: rect(0px, 60px, 180px, 20px);
}
Browser Compatibility
- Google Chrome 1+
- Mozilla Firefox 1+
- Internet Explorer 8+
- Opera 7+
- Safari 1+
Note: Here details of browser compatibility with version number may be this is bug and not supported. But recommended to always use latest Web browser.