grid-builder

Bootstrap 3 Grid Builder

Twitter Bootstrap is awesome .Since its inception it has now got more than 57000 stars , 19,000 forks ,  10,000 issues.

Way to go @mdo and @fat.

The Bootstrap 3 was finally released on 19th August , 2013 ,here’s the link to the blog post annoncing its release .

The biggest advantage was the new super-powerful grid system added to Bootstrap .With four tiers of grid classes—phones, tablets, desktops, and large desktops—you can do some super crazy awesome layouts.But it quickly gets complicated as you try to wrap your head around it.Bootstrap 3 is more flexible in terms of what it can do but keeping 3 different layouts in your head
simultaneously is very complex.

This is why I built the open-source Bootstrap 3 Grid Builder.

grid-builder
twitter bootstrap

 

Features :-

1 . Pre-built templates for kick-starting development.

2. Content placeholders to understand which piece goes where.

3. Quickly testing your layout across multiple devices.

4. Optimized code generation .

Expert Tips for getting started with responsive design :-

1. Start with widely used frameworks like Bootstrap or Foundation. Use the builder for a quick-start on the layout.

2. Don’t start from scratch  : Keep a lookout for the open-source js libraries or jquery plugins that I have already done the bulk of the work. Here’s a great list to get you started : http://jquer.in/category/responsive/

3.Reduce your content : think small screen first , then tablet design and finally for the desktop.

4. TEST ,TEST and TEST : Use tools like RWD bookmarklet , jresize , finally testing on a real device .Also don’t forget to use fast-click or touch for instant clicks on mobile.

DEMO

Github

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>