These grid PSDs are based on the "basic" Twitter Bootstrap column/gutter responsive behaviour.
Web: 1280px width - 70px columns - 30px gutter
Tablet: 1024px width - 60px columns - 20px gutter
Mobile: 320px width - 10px columns - 10px gutter
Enjoy this freebie and feel free to comment....
Cheers - and happy father's day
10 months ago
Amazing gift, thank you!
8 months ago
this is great!
Much appreciated, this is great!
7 months ago
Thank you, just what I needed :)
very handy, thanks!
6 months ago
Nice one. Cheers!
5 months ago
Is this Bootstrap 3 ready?
@Dillen Verschoor Bootstrap 3 is a % based grid - which can't be done in Photoshop....
Nevertheless - As Bootstrap 3 is also based on 12 columns you can easily use this PSD for it.....
@all - thanks guys... :)
you rock :)
4 months ago
Thanks for such a great resource!
3 months ago
How do you handle the Left and Right Padding?
2 months ago
@Willy Bravenec You mean inside the CSS? Just overwrite the Bootstrap rules :)
Should I use the web grid for designing responsive content for retina iPad in landscape position? The retina display are wider than a desktop screen sometimes if I consider a full screen content...
about 1 month ago
@Leonardo Lima Nope... The iPad Grid is fine since the retina iPad resolution is TECHNICALLY 2048px but the browser is smart enough to automatically translate it to 1024px (means JS + CSS + etc recognise 1024px not 2048px)
Beside that - EVERY non-css/html element (like images, etc) should have twice of the original resolution for retina displays to not look pixelish
Thx Michael! More power to the full screen responsive layouts...:-)
keyboard shortcuts: ← previous shot → next shot L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
Copyright © 2009–2014 Dribbble LLC. All screenshots © their respective owners. Shipped from Salem, Mass. USA.