How can I align the text in the same space when the word are wrapped?

Question

image of my problem

I was looking forward to how can I maintain their spaces if they are wrapped when resized. For example, the bg-center must be just below the <div className="----". How can I make that?

I already tried going through settings and searching in google but nothing matches my problem.

Answer 1

It looks like you have "editor.wrappingIndent": "none" in your settings. Try setting it to something else like "same", "indent", or "deepIndent".

If you want the setting value of your choice to only take effect for JSX files specifically, then wrap the settings in a "[javascriptreact]": { ... } block in settings.json.