Search code examples
cssphpstormjetbrains-ide

How to keep the indentations when using reformat of CSS in PhpStorm?

I use BEM-style naming of CSS-classes.

.b-ajax-window-header {
    display : flex;
}

    .b-ajax-window-header__left {
        margin-right : 20px;
    }

    .b-ajax-window-header__right {
        margin-left : auto;
    }

But when I use «Reformat Code» in PhpStorm the second and third CSS instructions are losing their indentations.

.b-ajax-window-header {
    display : flex;
}

.b-ajax-window-header__left {
    margin-right : 20px;
}

.b-ajax-window-header__right {
    margin-left : auto;
}

I've looked for setting to stop this, but I didn't find anything. Could you help me, please?

Solution

  • There is no such setting.

    This ticket seems relevant: https://youtrack.jetbrains.com/issue/WEB-26136 -- watch it (star/vote/comment) to get notified on any progress.

    P.S. If you need some sort of indenting/grouping ... why not use Less/Sass that has it? Less code to be written (no need to repeat .b-ajax-window-header 3 times). It will also have grouping in Structure panel.

    You need it for source reading, right? Final compiled CSS is not important here (how it will be formatted); plus minification later...