Skip to content
This repository has been archived by the owner on Feb 25, 2018. It is now read-only.

fluid: how to use it with responsive concept

smooth-graphics edited this page Jul 13, 2011 · 1 revision

With MODX-Boilerplate we now have the possibility to create a super-responsive, fluid layout targeting mobile devices first. In v2 the fluid-layout called 1140px grid is built in and now is modified for the responsive concept.

If you want to use it in your site you just need to copy the css-files from the /1140px/css/ folder into the main css folder and replace the site_header.html with the one from /1140px/ folder, too. You then should have your css files:

  • core.css (not replaced)
  • smartphone.css
  • ipad-portrait.css
  • ipad.css
  • iphone4.css
  • display.css

These files contain different styles and grid-styles fitting to their device-display-sizes. filenames are self-explaining but display.css is the default desktop monitor device-size.

In the case you are using the responsive concept you don't need style.css any longer. This is only served for people not using responsive-media-queries.