Is there such a CSS framework? [closed]

Question

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.

Closed 9 years ago.

I'm searching for a CSS framework that is responsive, large (more than 1000px), and where I can do the folowing :

Large design :

Normal design :

Mobile design :

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

Answer 1

You want to serve different css by detecting the screen size.

This tool does it: Adapt.js (Take a look at Less too)

With Adapt.js you can do stuff 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 the link