csswizardry/inuit.css Skeleton: Beautiful Boilerplate for Responsive, Mobile-Friendly Development Frameless CSS Hórus | CSS Framework for responsive and mobile websites Initializr - Start an HTML5 Boilerplate project in 15 seconds! Less Framework 4 I called Less Framework "a CSS grid system for designing adaptive websites". It was basically a fixed-width grid that adapted to a couple of then popular screen widths by shedding some of its columns. It also had matching typographic presets to go with it, built with a modular scale based on the golden ratio. Contrary to how most CSS frameworks work, Less Framework simply provided a set of code comments and visual templates, instead of having predefined classes to control the layout with. /* Default Layout: 992px. Less Framework was popular in the early days of responsive design. Eventually, I moved on from fixed-width grid systems and worked on a fully fluid-width one, in the form of Golden Grid System. Less Framework's popularity was helped by the following contributions and the lovely people behind them (dead links crossed off):
Open DAWS v4.0.1 theory For a long time, we've built sites that specified column widths in HTML. This leads to a compromised design, with an app or site that looks good on a single large resolution, and reasonable on mobile. This isn't good enough. The Open Digital Application Wireframing Styleset (or OpenDAWS) is an attempt to correct this. what OpenDAWS is... OpenDAWS can be thought of as an structured library; that is to say, it's a huge set of resets and helpful classes, as well as the logic for grid layouts, but without any of the constraints of a full framework. This means that you can create a design limited in width only by the user's viewport size. Moreover, by not specifying widths in HTML, we're free to completely change how our design looks at these sizes. ...& what it isn't This is not a full framework, in the vein of Foundation, Bootstrap or Skeleton. It's also not an attempt to style everything. Finally, it's not backwards incompatible. basic usage html <header>... mobile css making it responsive
rwdgrid.com / Responsive Grid System for your next Project 34 Responsive Grid System Columnal | A responsive CSS grid system helping desktop and mobile browsers play nicely together. CSS Smart Grid — A Lightweight, Responsive, Mobile First 960 Grid As a Grid System There's only one CSS file to include: smart-grid.css . Place that in <head> your own stylesheet. Wrap your page inside a <div class="container"> . Note that you can use more than one container if your need calls for it: <header id= "hd" > <div class= "container" > <h1> My Page Title </h1> </div> </header> <section id= "main" > <div class= "container" > <p> This is where my content goes. Column Markup Grid columns are achieved by adding a column class to any element. <div class= "container" > <div class= "row" > <article id= "main" role= "main" class= "columns two-thirds" > <p> The beginning of the best article in the history of humanity. If you only have one row of columns in a container, you can ommit the row: <div class= "container" > <article id= "main" role= "main" class= "columns two-thirds" > <p> The beginning of the best article in the history of humanity. Column Offsets Sometimes you need a blank column between content.
UIkit