Build Flexible Multi Column Layouts With Less CSS Framework

Less Framework is an HTML5 powered CSS framework for building flexible multi column website layouts for varying screen widths. It contains an eight-column grid optimized for a line-height of 24px, as well as a set of typography presets based on the golden ratio that fit into the grid’s vertical rhythm.

Less Framework layouts work perfectly in Chrome, Safari 3.0+, Firefox 3.0+ and Internet Explorer 7+. Your layout will collapse into a single column in legacy browsers and on small screens. The frameworks allow you to use HTML5 tags with the help of HTML5 enabling JavaScript file.

Developed by Joni Korpi; Less Framework is available for download under Creative Commons Attribution License.  You can find further information, demos & download on Less Framework Website.

Similar Posts:

• 52Framework: HTML5 and CSS3 Framework
• Elastic CSS Framework – Easily Make Elastic, Fixed & Liquid Layouts
• EZ-CSS: Lightweight CSS Framework
• Definitive List of CSS Frameworks – Pick Your Style
• Definitive List of Free WordPress Theme Frameworks

You can also stay updated by following us on Twitter, becoming a fan on Facebook or by subscribing to our FriendFeed.

Tags: Application Packaging, CC License, CSS Framework, HTML5, Joni Korpi, jquery, Libraries/Frameworks, Virtualization

EZ-CSS: Lightweight CSS Framework

EZ-CSS is a lightweight, browser-friendly and easy to use CSS framework for creating CSS layouts for your website. When using EZ-CSS framework you are not bound to a grid; and it lets you create multiple columns of any width, with or without gutters of any width.

EZZ-CSS promotes “Cut & Paste” methodology by providing several code snippets for your layout. You can select a code snippet for your layout and paste it in your code; and since EZZ-CSS facilitates deep nesting, you can nest another block of code inside existing blocks of code to achieve the layout you want.

Developed by Thierry Koblentz; EZ-CSS is available for download under MIT and BSD licenses.  You can find further information, demos & download on EZ-CSS Website.

Similar Posts:

• Elastic CSS Framework – Easily Make Elastic, Fixed & Liquid Layouts
• 52Framework: HTML5 and CSS3 Framework
• JPolite: Front End Portal Framework Based on jQuery
• xCSS: Object Oriented CSS Framework in PHP
• Definitive List of CSS Frameworks – Pick Your Style

You can also stay updated by following us on Twitter, becoming a fan on Facebook or by subscribing to our FriendFeed.

Tags: Application Packaging, BSD, CSS Framework, Libraries/Frameworks, MIT License, Thierry Koblentz, Virtualization

CSScaffold: PHP Based CSS Framework

CSScaffold is a CSS framework written in PHP. Unlike pure CSS framework (e.g., Blueprint, etc) that uses the standard abilities of CSS, it uses PHP to extend CSS. The syntax looks and feels exactly like CSS, except that you have additional features.

Scaffold requires a web server with PHP 5+; Mod_rewrite for Apache is required if you want it work automatically route your CSS files through Scaffold. If you don’t want it work automatically, you can point your CSS files directly to Scaffold.

Features

• Constants
• SASS style Mixins
• Nested Selectors
• Expressions
• Compressed, Cached and Gzipped on-the-fly
• Perform PHP operations
• Extendable through Plugins

Plugins

• Layout – Create 960.gs style grids with Mixins and classes.
• OOCSS – Extend one selector using another selector
• Browsers – Target specific browsers
• Minify – Uses the minify library to compress your CSS
• Icy Compressor – An alternative to Minify
• Validate – Validates your CSS using the W3C validator
• Image Replace – Image replace titles by just linking to the image. Scaffold will find the height and width of the image and take care of the rest of the properties needed to image replace the text.

Developed by Anthony Short; CSScaffold is available for download under New BSD License.  You can find further information, demo & download on CSScaffold Project Website.

Similar Posts:

• LESS CSS Framework
• Definitive List of CSS Frameworks – Pick Your Style
• KeyTable – Keyboard Navigation & Event Binding For HTML Table
• CodeIgniter – Faster and Lighter PHP Framework
• List of Really Useful JavaScript Libraries

Tags: Anthony Short, CSS Framework, Libraries/Frameworks, New BSD License

xCSS: Object Oriented CSS Framework in PHP

Inspired by OOCSS and SASS; xCSS is PHP based CSS framework that allows you to work object-oriented and keeps your workflow as “DRY” as possible. xCSS is lightweight and seamlessly integrates into any existing workflow; key features include using variables, nesting child objects, extending objects and comments.

xCSS requires PHP5 and is fairly easy to install and configure.It is most suitable for you if you are comfortable with object oriented programming and need to develop complex style structures.

Developed by Anton Pawlik; xCSS is available for download under MIT License.  You can find further information, demo & download on xCSS Website.

Similar Posts:

• Yii PHP Framework – Easy, Efficient and Extensible
• Definitive List of CSS Frameworks – Pick Your Style
• MooTools – A Compact JavaScript Framework
• Raphaël – JavaScript Library For Vector Graphics
• Zend Framework – Flexible PHP Framework

Tags: Anton Pawlik, CSS Framework, Libraries/Frameworks, MIT License

LESS CSS Framework

LESS (Leaner CSS) is a CSS Framework that provides an alternative for SAAS. It extends CSS with variables, mixins, operations and nested rules. As an extension to CSS, LESS is not only backwards compatible with CSS, but the extra features it adds use existing CSS syntax. This makes learning LESS a breeze, and if in doubt, lets you fall back to CSS.

LESS is an extension of CSS. You can write LESS code just like you would write CSS, except you need to compile it to CSS. That’s where you can use LESS Ruby gem which will compile LESS code to CSS. Note that you can use LESS compiler to translate the .less file into a .css file and use it in any type of project.

More is the official LESS plugin for Ruby on Rails applications. It automatically parses your applications .less files through LESS and outputs CSS files. Here is what More will do for you:

• Recursively looks for LESS (.less) files in app/stylesheets
• Ignores partials (prefixed with underscore: _partial.less) – these can be included with @import in your LESS files
• Saves the resulting CSS files to public/stylesheets using the same directory structure as app/stylesheets

Developed by Alexis Sellier; LESS is available for download under Apache License.  You can find further information, demo & download on LESS Website.

Similar Posts:

• Lighter.js – Syntax Highlighting For MooTools
• Prototype JavaScript Framework – For Dynamic Web Applications
• Mapstraction – JavaScript Mapping Abstraction Library
• Yii PHP Framework – Easy, Efficient and Extensible
• CakePHP – PHP Framework For Rapid Development

Tags: Alexis Sellier, Apache License, CSS Framework, Gem, Libraries/Frameworks, More, ruby, Ruby on Rails

Elastic CSS Framework – Easily Make Elastic, Fixed & Liquid Layouts

Version 2.0 of Elastic CSS framework has just released. Elastic is based on the printed layout techniques of 4 columns but allows to you create unlimited column combination and also make elastic, fixed and liquid layout easily. It provides a declarative syntax language to define the layout structure and behavior.

Elastic lets you to handle liquid, fixed, and elastic layouts, and even mix this techniques in the same layout. It provides a set of helper classes, to accomplish hard things by pure CSS like: same-height, full-width, and vertical-center. Other important features include: unlimited nesting, integrated clear fix, unobtrusive with absolute positioning: no hidden or auto on clearfix, same height columns, vertical and horizontal center.

You may also be interested in following related posts:

• Definitive List of CSS Frameworks
• Guidelines for Developing Your Own CSS Framework

Elastic is cross browser and has been tested to work on Firefox 2/3, Safari 3/4, Opera 9.6 and Internet Explorer 6/7/8. You can find further information, demo & download on Elastic CSS Website.

Tags: CSS Framework, Libraries/Frameworks