Question

Over the past year, I've become a fan of BluePrint.css for managing larger web app projects. I've also looked at 960 and YUI's offerings as well. All good (though I have some complaints about YUI).

I'm working on a mobile project now and given that we need to accommodate various screen sizes, I'm thinking a css grid framework is the way to go again.

I'll likely be heavily modifying the BluePrint logic and/or building one from scratch, but before I did that, I was wondering if anyone has used a particular framework for mobile and would recommend one particular one for mobile dev.

I've looked at Less and cssgrid

http://lessframework.com/

http://cssgrid.net/

Both are quite nice. Less uses consistent column widths and changes the number of columns. Cssgrid uses fluid columns to accommodate the screen sizes. I, on the other hand, am envisioning yet another method where we'd use a fix number of columns, then adjust the widths on the fly based on the screen width. I'm preferring that option as I've found that fluid grids can become difficult to manage with heavy nesting. Any other options I should take a look at first?

Clarification: I don't necessarily need a full UI framework at the moment. We'll definitely end up with one, be it jQuery or our own, but the primary goal right now is to find and/or build a CSS framework to handle general page layout and positioning across multiple mobile device screen resolutions and orientations.

Was it helpful?

Solution

There's the '320 and up' framework, and the HTML 5 mobile boilerplate (although the latter isn't so much a framework, but a starting point).

OTHER TIPS

If you're looking to develop for iPhone, you might take a look at the iUI Framework

Yes, it does sound like you'll have build your own "BluePrint Mini" or "480 Grid System"--and we'll be here to admire it.

One point of departure could be the work of Matthew James Taylor. He does rely on the fluid grid you've said you don't want, but it's worth a look.

DA,

You can try the jQueryMobile framework.

I believe this post can help you.

Cleber.

Here is one that I am considering using:

http://jeromeetienne.github.com/jquery-mobile-960/

Looks like it has some display bugs with smaller grid sizes.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top