Servage Magazine

Information about YOUR hosting company – where we give you a clear picture of what we think and do!

Beautiful grid-view with HTML5, CSS and Javascript

Saturday, January 12th, 2013 by Servage

Responsive web design is becoming more and more popular, where elements automatically fit to almost any type and size of screen. Elements are quickly resized and positioned based on browser size. This is extremely nice, because it helps you to provide a great user experience on your website, not matter which device and resolution the user has. Most solutions implement standard lists for small screens like mobile phones, and build larger and more complex grids of content the more screen size is available to them.

Example of beautiful grid layout

These guys have created wonderful grid which displays different content types in various sizes, and positions it according to screen size. You can even resize your browser window, and the system will immediately rearrange the items. “Dynamit is a contemporary digital consultancy solving complex business challenges with strategy, design and technology.”

Response frameworks

While the example above is built mainly with a custom grid handler, there are some frameworks delivering a lot of help to quickly build appropriate sites with the intendedĀ behaviorĀ and design.

Check out Foundation and Bootstrap, they both deliver lots of help for quick development. You can position your content in a grid system, and the framework will make sure it looks appropriate on all screen sizes.


Beautiful grid-view with HTML5, CSS and Javascript, 3.0 out of 5 based on 3 ratings
Categories: Software & Webapps

Keywords: , ,

You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

No comments yet (leave a comment)

You are welcome to initiate a conversation about this blog entry.

Leave a comment

You must be logged in to post a comment.