Pinterest popularized the masonry grid style layout. Here’s a simple solution for a masonry layout built with pure CSS3, and no javascript or floats. [css] // Parent Element, or Container .grid (@columns: 3, @gap: 10px, @width: 100%) { -moz-column-count: @columns; -moz-column-gap: @gap; -webkit-column-count: @columns; -webkit-column-gap: @gap; column-count: @columns; column-gap: @gap; width: @width; } // Child Element, or…More
Tag Archives: layout
Google+ will improve your social media experience, even if you don’t use it.
The Question My friend at Good Web Work asked the question,”To what problem is Google+ a solution?”. I started to write a comment on his post, but after the scroll bar popped up on the comment form realized this was blog post material . I have no idea what I’m talking about I haven’t used Google+ yet…More
How to Write Object Oriented CSS
* Image taken from the cover art of the world-famous Tetris video game. Objects Shmobjects. The first time I heard about Object Oriented CSS was from a tutorial on NetTuts. At the time, I viewed OOCSS as just another random framework somebody was imposing on the web community. I had not given it much thought since…More
Free Desktop Wallpaper Background: Black Boxes
My latest free desktop wallpaper design is an arrangement of dark gray blocks on a black background similar in layout to Piet Mondrian‘s Composition II in Red, Blue, and Yellow, that he painted in 1930. I’m not saying its as revolutionary as his painting, only that it shares the same balance of visual weight. If…More