Skip to content

lord/flexblocks

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

65 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Flexblocks: Layout System
Build Status

Flexblocks is a lightweight, easy-to-learn CSS layout system, designed to fix the two biggest pain points of new CSS users: alignment syntax and margin edgecases. For a detailed explanation of how Flexblocks is different, check out the announcement blog post.

Installing Flexblocks

Installing Flexblocks is simple — if you're just using plain CSS, just download dist/flexblocks-responsive.css. If you're a SCSS user, download the contents of src, and just include the contents of flexblocks-responsive.scss.

Using Flexblocks

Using Flexblocks is easy! Here's a guide, click to enlarge.

Flexblocks: Layout System

Customizing Flexblocks

If you change the contents of flexblocks-responsive.scss, you can update the default widths of the gap classes, and add an optional prefix to all class names. To recompile the SCSS into CSS, you can run npm install; npm run build.

Getting Help

I'm available on Twitter and am more than happy to answer any questions/concerns/thoughts. If you're having issues or aren't sure how to do something, feel free to let me know.

About

A CSS layout library

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages