Initialize.css

Initialize.css is a complete collection of CSS best practices based on Normalize.css and HTML5 Boilerplate. It's customizable with predefined and optional properties. Configuring Initialize.css reduces the amount of CSS selectors you need for initializing your project.

Install

npm

npm install initialize-css

bower

bower install initialize-css

Usage

sass / scss (from node_modules or bower_components)

@import "module_folder_name/initialize-css/dist/initialize";

sass with browserify

@import "initialize";

or just copy the generated css files (with vendor prefixes)

<link rel="stylesheet" href="styles/initialize.min.css">

Configure

Overwrite default values for generic typography:

$initialize-box-sizing: border-box;
$initialize-font-family: sans-serif;
$initialize-font-size: 1em;
$initialize-line-height: 1.4;

Microsoft dropped support for IE8, IE9 & IE10. If you still have to support these old dinosaur browsers, just set dinosaur mode to true.

$initialize-dinosaur-mode: true;

Optional values:

$initialize-color: #000;
$initialize-block-margins: 0 0 0.75em;

$initialize-heading-color: #000;
$initialize-heading-font-family: sans-serif;
$initialize-heading-margins: 1em 0 0.75em;

$initialize-print-styles: true;