CSS3 Diamond Grid Images (vertical) - Constant Size, Overflow
The images in this demo break the grid and flow to the next line as browser width decreases. Image size stays constant.
Images are vertical inside of a rotated diamond "mask".
Compatibility
- IE9+ *
- Chrome
- Safari
- Firefox
- Opera
- Android
- iOS
* Images are not rotated in IE7/8 and will display at their native size regardless of the size of the div they're in (no "background-size" support).
Related
- CSS3 Diamond Grid Images - Constant Size, Overflow
- CSS3 Diamond Grid Images - Fluid Scale, Responsive
- CSS3 Diamond Grid Images (vertical) - Fluid Scale, Responsive
More demos and snippets
Did you find this useful? There are more demos and code snippets this way.