How can i format visual studio code to add an indented space between curly brackets in CSS when i hit enter?

Question

When I open the curly brackets in CSS and hit enter, it just jumps to the next line like this:

body {
}

It doesn't add a new line with an indentation like it used to, I tried looking through the setting and trying everything but couldn't get a result. I want it to look like this when I press Enter:

body {
    
}

user_10531410 · Answer

What you need is a VSCode plugin called "Prettier".

It can be downloaded in the "Extensions" section of VSCode, or downloaded from this link: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

user_18206501 · Answer

You can try the following:

Check if you have set your default formatter to prettier
You can check the box to Format On Save or ;
Autosave: There are are currently 4 options available -:

a) off

b) afterDelay

c) onFocusChange

d) onWindowChange

user_16987797 · Answer

To anyone who is facing this problem in VSCode. This feature is not related to any extension, not Prettier or any other extension. What you have to do to fix this bug is:

Go to the settings
Search for Folding Strategy and choose the Auto option
Then enable Folding

It adds that indentation in both HTML and CSS

How can i format visual studio code to add an indented space between curly brackets in CSS when i hit enter?

3 Answers