It is possible to change tab size for markdown code preview ? Currently 1 tab = 8 spaces.
3 Answers
If you are referring to the markdown preview window you can apply custom css to manipulate the way it is displayed using the markdown.styles setting.
"markdown.styles": [ "Style.css" ] If you are referring to the editor window you can set the tab size for markdown files by editing your settings file:
"[markdown]": { "editor.tabSize": 4 } To access the settings file click File -> Preferences -> Settings
2 Comments
Style.css file in your workspace root for hte sample. This css works for tab size: pre { tab-size: 4; }pre code { tab-size: 8; }If you want to use that file "https://github.com/SepCode/vscode-markdown-style/blob/master/preview/github.css", we know that "https://raw.githubusercontent.com/SepCode/vscode-markdown-style/master/preview/github.css", the URL is not working.
I have a good idea, we can use Github Pages.
Add a submodule in your repository, like this "git submodule add https://github.com/SepCode/vscode-markdown-style.git". And now we can use the URL "https://sepcode.github.io/vscode-markdown-style/preview/github.css" set markdown.styles.
Step:
- clone your GitHub pages "
git clone https://github.com/SepCode/SepCode.github.io.git" cd SepCode.github.iogit submodule add https://github.com/SepCode/vscode-markdown-style.gitgit commit -am 'added vscode-markdown-style module'git push- setting vscode setting.json
{ "markdown.styles":["https://sepcode.github.io/vscode-markdown-style/preview/github.css"] }
the vscode-markdown-style repository is just an example, we should use ourself's CSS file. This way is more convenient and controllable.