Is there such a CSS structure?

Question

I am looking for a CSS framework that is responsive, large (over 1000 pixels), and where can I do the following:

Great design:

Normal design:

Mobile design:

Any suggestions? I tried 960.gs , Titan framework , 1140 css grid , and Golden Grid System , but I'm not sure that I can do whatever I want in any of them.

Answer 1

You want to serve different css by determining screen size.

This tool does this: Adapt.js (See Less )

With Adapt.js, you can do things like this:

// Edit to suit your needs. var ADAPT_CONFIG = { // Where is your CSS? path: 'assets/css/', // false = Only run once, when page first loads. // true = Change on window resize and page tilt. dynamic: true, // Optional callback... myCallback(i, width) callback: myCallback, // First range entry is the minimum. // Last range entry is the maximum. // Separate ranges by "to" keyword. range: [ '0px to 760px = mobile.css', '760px to 980px = 720.css', '980px to 1280px = 960.css', '1280px to 1600px = 1200.css', '1600px to 1920px = 1560.css', '1940px to 2540px = 1920.css', '2540px = 2520.css' ] }; 

Answer 2

ooh what you need is Css3 media queries.

http://ie.microsoft.com/testdrive/HTML5/CSS3MediaQueries/

Check link