which tool
Hi,
I am after a grid system that allows responsive design and works for mobiles as well.
Now I am wasting too much time looking at grid systems like 960 grid responsive that doesnt seem work for optimally a mobile device . As in the columns should resize , move and some disappear for mobile devices.
960 responsive grid tutorials are pointing back to fixed grid tutorials
So I looked at bootstrap which did appeared to work better for mobiles and looked at tutorials for this like http://www.youtube.com/watch?v=TGba0p2GX2o&list=PLKlA1QwYBcmcEUUBSmkl8_kgwn-_zuy-W
and the guy walks through another fixed grid display.
This is what I want to do with a grid.
I need to do something like this website, see how it changes to mobile view with resizing.
http://www.opencolleges.edu.au/distance-education
I am after a grid system that allows responsive design and works for mobiles as well.
Now I am wasting too much time looking at grid systems like 960 grid responsive that doesnt seem work for optimally a mobile device . As in the columns should resize , move and some disappear for mobile devices.
960 responsive grid tutorials are pointing back to fixed grid tutorials
So I looked at bootstrap which did appeared to work better for mobiles and looked at tutorials for this like http://www.youtube.com/watch?v=TGba0p2GX2o&list=PLKlA1QwYBcmcEUUBSmkl8_kgwn-_zuy-W
and the guy walks through another fixed grid display.
This is what I want to do with a grid.
I need to do something like this website, see how it changes to mobile view with resizing.
http://www.opencolleges.edu.au/distance-education
Have you tried using @media css , there are various framework for responsive try using them.
http://lessframework.com/
http://codevisually.com/
http://twitter.github.com/bootstrap/index.html
http://foundation.zurb.com/index.php
http://lessframework.com/
http://codevisually.com/
http://twitter.github.com/bootstrap/index.html
http://foundation.zurb.com/index.php
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Hi,
Yes I can code for 2-3 version of the same page because I can do this with media queries. The issue is doing the same using a grid.
Bootstrap mentions (little hard to find) that the columns stack up automatically.
OK then what about a new navigation for a mobile do have 2 rows for this and display only 1 with a media query depending on a desktop/mobile display?
I just had trouble finding tutorials that explain these concepts I need to know for responsive layout/mobile layout for a grid like bootstrap.
Yes I can code for 2-3 version of the same page because I can do this with media queries. The issue is doing the same using a grid.
Bootstrap mentions (little hard to find) that the columns stack up automatically.
OK then what about a new navigation for a mobile do have 2 rows for this and display only 1 with a media query depending on a desktop/mobile display?
I just had trouble finding tutorials that explain these concepts I need to know for responsive layout/mobile layout for a grid like bootstrap.
Start here http://twitter.github.io/bootstrap/scaffolding.html#responsive and make sure to scroll down and read.
I think it helps to either draw out your page by hand on a napkin or in powerpoint or some other draw tool. I use napkins and Omnigraffle.
I have never been concerned about column height because I use a solid background. Check out themeforest.net and buy yourself a $20 template built on bootstrap and that might shorten your learning curve.
I think it helps to either draw out your page by hand on a napkin or in powerpoint or some other draw tool. I use napkins and Omnigraffle.
I have never been concerned about column height because I use a solid background. Check out themeforest.net and buy yourself a $20 template built on bootstrap and that might shorten your learning curve.
https://quirktools.com/screenfly/
What it will do is... help you in viewing your site in different popular devices...
Type in your site URL (Which you want to see) adn then press GO...
OR>>>>
Check this one too...
http://responsinator.com/?url=www.opencolleges.edu.au%2Fdistance-education