Search code examples
csssublime-text-plugin

Format CSS with rearrangement

In sublime text we can format CSS https://packagecontrol.io/packages/CSS%20Format

But additionally to that kind of formatting I'd like to be able to change the order as well.

Example, from

div{
    text-transform:uppercase;
    font-size:1.8em;
    font-weight: bold;
    height:20px;
    width:40px;
    display: block;
    padding: 0.8em 0 0.8em 0;
    text-align: center;
}

to

div{
    width:40px;
    height:20px;
    display: block;
    padding: 0.8em 0 0.8em 0;
    font-size:1.8em;
    font-weight: bold;
    text-align: center;
    text-transform:uppercase;
}

What happend was that it grouped items into predefiend(for me logical) order. Is it possible to do this using Sublime-text and if not maybe some other editor?

Solution

  • If your using sublime text you can use the css comb plugin

    It allows you to alter the ordering to how you prefer it via CSScomb -> Sort Order in your preferences.

    n.b. There is also a grunt plugin for css comb too