CSS Frameworks for mobile dev? [closed]

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.

Blackmarketeer

I think you are on the right track. I will investigate this more in the next week or so myself. I will make a blog post about it when I get some more answers. – Bertelli

It isn´t a css framework exactly. But, Nokia mobile web templates could help you. – Nightrider

I don't trust anything from Nokia. ;) – Blackmarketeer

Perhaps, you are right for smartphones. But it´s useful for many other phones. It´s important to know your target. – Nightrider

Answer 1

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).

Moonfish

I'm going to mark this one as the answer. THey were all great answers, but this one seems to be the only standalone CSS framework out there just for mobile. – Blackmarketeer

you are refering to 320 and up or the HTML 5 mobile boilerplate ? – Extenuation

Yes. He's referring to 320 and up or the HTML 5 mobile boilerplate. – Moonfish

Answer 2

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

Josephson

We're looking at dev'ing for all sorts of mobile devices and screen res's, hence the thought that a grid framework could help out with it. To clarify, I need less of a UI framework and more of a page layout grid system. – Blackmarketeer

It is framework to make website similar to iPhone theme – Congelation

Answer 3

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.

Ambagious

I like that '480 grid system'. Might have to name it 480.css ;) – Blackmarketeer

Answer 4

DA,

You can try the jQueryMobile framework.

I believe this post can help you.

Cleber.

Africanize

That's not a CSS framework, though. – Josephson

I'm about to dive into jQueryMobile as well, but It doesn't appear to have a full blown CSS framework for page layout (though it obviously inherits the jQuery UI concepts) – Blackmarketeer

Look this sencha.com/products/js – Africanize

again, I'm looking for a CSS grid layout framework more than a JS UI framework. – Blackmarketeer

Answer 5

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.

Boettcher