Loading…
Dataset 20261011-0550-f160c57 · measured 2026-10-11 05:50 UTC
offset-position
✕renders differently0 of 12 examples match Chromemotion-1
The property takes effect, but our pixels are not Chrome's. The difference map on this page shows where.
What the specification says
- Initial value
- normal
- Applies to
- transformable elements
- Inherited
- no
- Percentages
- Refer to the size of containing block
- Computed value
- The normal or auto keywords, or a computed <position>
- Syntax
- normal | auto | <position>
The measurements
12 examples, 0 of them matching Chrome, the rest first. Each is one declaration on a small page, drawn by Chrome and by our engine. Drag the handle to wipe between them.
offset-position:20px✕renders differently
Our renderChrome7,200 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 7,200
- Max channel delta
- 204
offset-position:left 20px top 20px✕renders differently
Our renderChrome7,200 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 7,200
- Max channel delta
- 204
offset-position:left✕renders differently
Our renderChrome9,600 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 9,600
- Max channel delta
- 204
offset-position:left center✕renders differentlyOur renderChrome9,600 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 9,600
- Max channel delta
- 204
offset-position:left bottom✕renders differently
Our renderChrome9,600 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 9,600
- Max channel delta
- 204
offset-position:left 20px✕renders differently
Our renderChrome9,600 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 9,600
- Max channel delta
- 204
offset-position:left 50%✕renders differently
Our renderChrome9,600 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 9,600
- Max channel delta
- 204
offset-position:bottom✕renders differently
Our renderChrome19,200 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 19,200
- Max channel delta
- 204
offset-position:20px top✕renders differently
Our renderChrome8,000 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 8,000
- Max channel delta
- 204
offset-position:left top✕renders differently
Our renderChrome8,000 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 8,000
- Max channel delta
- 204
offset-position:top✕renders differently
Our renderChrome16,000 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 16,000
- Max channel delta
- 204
offset-position:center top✕renders differentlyOur renderChrome16,000 pixels differ from Chrome, the largest by 204 of 255 on one channel.
- Differing pixels
- 16,000
- Max channel delta
- 204
Which values were measured
“Supported” on one example means “supported at the value we tried”. The property’s declared grammar has 55 branches; 12 of them carry a measurement. The publishing ceiling is 12 examples per property — a branch past it is left out by our choice, not by accident.
| Value | Measured |
|---|---|
| left | ✕renders differently |
| center | not measured |
| right | not measured |
| top | ✕renders differently |
| bottom | ✕renders differently |
| x-start | not measured |
| x-end | not measured |
| y-start | not measured |
| y-end | not measured |
| block-start | not measured |
| block-end | not measured |
| inline-start | not measured |
| inline-end | not measured |
| 20px | ✕renders differently |
| 50% | not measured |
| left top | ✕renders differently |
| center top | ✕renders differently |
| right top | not measured |
| x-start top | not measured |
| x-end top | not measured |
| left center | ✕renders differently |
| left bottom | ✕renders differently |
| left y-start | not measured |
| left y-end | not measured |
| 20px top | ✕renders differently |
| 50% top | not measured |
| left 20px | ✕renders differently |
| left 50% | ✕renders differently |
| block-start inline-start | not measured |
| center inline-start | not measured |
| block-end inline-start | not measured |
| block-start center | not measured |
| block-start inline-end | not measured |
| start start | not measured |
| center center | not measured |
| end end | not measured |
| left 20px top 20px | ✕renders differently |
| right 20px top 20px | not measured |
| x-start 20px top 20px | not measured |
| x-end 20px top 20px | not measured |
| left 50% top 20px | not measured |
| left 20px bottom 20px | not measured |
| left 20px y-start 20px | not measured |
| left 20px y-end 20px | not measured |
| left 20px top 50% | not measured |
| block-start 20px inline-start 20px | not measured |
| block-end 20px inline-start 20px | not measured |
| block-start 50% inline-start 20px | not measured |
| block-start 20px inline-end 20px | not measured |
| block-start 20px inline-start 50% | not measured |
| start 20px start 20px | not measured |
| end 20px end 20px | not measured |
| start 50% start 50% | not measured |
| normal | not measured |
| auto | not measured |
Measured against Chrome 148.0.7778.96 on 2026-10-11, with up to 40 candidate values tried per property. All properties · How the measurement works