WebAppers

/ best free open source web resources /

Shopify

How to Create a Grid of Diamonds with CSS

Posted · Category: Information, License Free

With the continued adoption of advanced CSS by browsers, we are starting to have the ability to do more and more using just CSS. As we have seen, you can make all kinds of crazy shapes with only CSS. On a recent client project, Trevor Davis has created a grid of diamonds with CSS and shared the tutorial: Who Says the Web is Just for Squares?

He is using Modernizr to detect if the browser supports CSS3 Transforms. And, he is using Sass and Compass for all of the CSS. You may now go forth and make some creative layout with different shapes.

diamond-grid-layout

Requirements: Sass and Compass CSS
Download Link: http://davist11.github.com/css-diamond-grid/
License: License Free

0 Comments
Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons