Gridless: Back to the Simplicity of Absolute Positioning

Absolute positioning can be implemented using percentage values to make content or blocks get positioned based on its container. You can also use width & height in percentage to make the dimension fluid (or use vw/vh unit to resize them based on the screen size). But these alone are not enough to produce responsive behavior. Normally, you will notice that reducing screen size will expand or extract a text block. This can cause conflict with other blocks and makes them difficult to align, because the expanded dimension can vary based on the amount of text.

To solve these problems and other related issues, Gridless framework is created. The mission is to implement responsive design using absolute-positioning. The Gridless framework contains only 2 files:

• gridless.css
• gridless.js

The Gridless framework is the framework used by the GridlessBuilder.js (the editor) to produce responsive results. Combined with the GridlessBuilder.js editor, we can easily build responsive content with the freedom of block positioning, scaling, rotating, aligning and more.