How to rearrange css code in .css files

Hello,

I want to rearrage the styles inside my css classes in alphabetical order like in the example bellow, how can I achieve that with PhpStorm ?

.1
{
b:
c:
a:
}

.2
{
c:
a:
b:
}

to sort it

.1
{
a:
b:
c:
}

.2
{
a:
b:
c:
}

and that's it no other changes ...

Thanks

6 comments

Here is the exact code which I would like to reformat, to arrange the styles in alphabetical order but without to change brackets, commas, spaces ...etc

/* styles for 768px or more */
@media screen and (min-width: 768px)
{
    .content_placeholder
    {
        border: 1px solid red;
        box-sizing: border-box;
        width: 50%;
        float: left;
    }

    .content
    {
        margin: 10px;
        border: 1px solid blue;
    }
}

/* styles for 768px or less */
@media screen and (max-width: 768px)
{
    .content_placeholder
    {
        border: 1px solid red;
        box-sizing: border-box;
        float: none;
    }

    .content
    {
        margin: 10px;
    }
}

0

Hi there,

You can try CSSReorderer plugin.

Other than that: http://youtrack.jetbrains.com/issue/WEB-22

0

I've installed CSSReorder but how do I use it ?

Thanks

0
I've installed CSSReorder but how do I use it ?

https://github.com/anton-rudeshko/CSSReorder -- USAGE section

0

Thanks, it's working nice, but I can't find where to choose how to rearrange the code, based on alphabetical order or element order ... By default is by element.
Or if to rearrange the brackets or not ...

0

Please contact plugin author for details -- I do not know as I have never used this plugin myself.

0

Please sign in to leave a comment.