Tag: layout

  • Quick Tip: LESS Mixins for Pure CSS Pinterest / Masonry style grid layout

    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…

  • 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…

  • 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…

  • 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…