Skip to content

CSS: ; can overrun #18360

@seiyab

Description

@seiyab

I think the root cause of this issue is that prettier does not seem to count ; or !important when counting line widths.

I've scribbled up a set of tests in this playground that check for edge cases around 80 characters.

For instance, both of the following margin declarations are 81 characters long. The first is not reformatted onto two lines, while the second one is correctly reformatted.

.test-81-char-declaration {

  margin: $really-long-variable-name $another-really-long-name $a-third-long-nam;

  margin: $really-long-variable-name $another-really-long-name $a-third-long-name

}

Prettier formats this as:

.test-81-char-declaration {

  margin: $really-long-variable-name $another-really-long-name $a-third-long-nam;

  margin: $really-long-variable-name $another-really-long-name

    $a-third-long-name;

}

Originally posted by @BPScott in #4460

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions