PostCSS CSSSimple

A PostCSS plugin makes your CSS codes simple and compatible. It fix common browser bugs, add useful polyfills and remove unnecessary code. 中文说明

• Useful polyfill to complete text-overflow, RGBA etc. Especially contains mix-ins which Autoprefixer won't support(Convert ::before to :before or add word-wrap with overflow-wrap).
• Fix common IE6~8 bugs;
• Remove unneccessary code.

Recommend use CSS-Simple WITH Autoprefixer.

Features

Useful mixins

/* Input example */
.foo::before {
    text-overflow: ellipsis;
    overflow: hidden;
}
.bar {
    opacity: .8;
}
.baz {
    background: rgba(0, 0, 0, .2);
}

/* Output example */
.foo:before {
    text-overflow: ellipsis;
    overflow: hidden;
    _zoom: 1;
    white-space: nowrap;
}
.bar {
    opacity: .8;
    filter: alpha(opacity=80)\9;
}
.baz {
    background: rgba(0, 0, 0, .2);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#33000000", endColorstr="#33000000")\9;
}

Fix common bugs

/* Input example */
.foo {
    display: inline-block;
}
.bar {
    float: left;
    margin: 20px;
    overflow: hidden;
}

/* Output example */
.foo {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}
.bar {
    float: left;
    _display: inline;
    margin: 20px;
    overflow: hidden;
    _zoom: 1;
}

Remove unnecessary code

/* Input example */
.foo {
    position: absolute;
    display: inline-block;
}
.bar {
    float: left;
    display: block;
}
.baz {
    position: absolute;
    float: left;
}

/* Output example */
.foo {
    position: absolute;
}
.bar {
    float: left;
}
.baz {
    position: absolute;
}

Usage

postcss([require('postcss-csssimple')])

About

This project is a fork from CSSGrace and add new features to fix common IE bugs, and CSS-Simple doesn't support custom syntax to keep the code follow standards.

Changelog

License

-- EOF --