Uploaded March 2024 | Updated September 2026, 1 hour ago

---

Visual Studio Code tip showing you how to fix broken block comments behavior in CSS/HTML when toggling a comment adds a new comment instead of uncommenting the focused comment.

EDIT: Jayden Pearse noted in the comments that you can use "resourceLangId" instead of "resourceExtname," which will also work on files without an extension, as long as the correct language (CSS or HTML) is detected or set manually.

BETTER When Expression: editorTextFocus && !editorReadonly && (resourceLangId == 'html' || resourceLangId == 'css')

When Expression shown in the video: editorTextFocus && !editorReadonly && (resourceExtname == '.css' || resourceExtname == '.html')

Subscribe to CSS Weekly Newsletter:
💌 css-weekly.com

Help support my channel
👨‍🎓 Get a course: masteringlinting.com
🪧 Buy a CSS sticker pack: stickers.css-weekly.com
💖 Support me on Patreon: patreon.com/cssweekly

📖 Chapters
00:00 Problem with block comments in VS Code
01:39 Use Emmet to toggle block comments in CSS/HTML
02:23 Add Keyboard Shortcut to “Emmet: Toggle Comment” command
03:33 Restrict Keyboard Shortcut to CSS & HTML files
06:49 Why you should use Emmet Toggle Comments command in VS Code

Keep up-to-date with CSS Weekly:
🐦 Twitter: twitter.com/@cssweekly
🎶 TikTok: tiktok.com/@cssweekly
🎇 Instagram: instagram.com/cssweekly
📘 Facebook: facebook.com/CSSWeekly

Keep up to date with what I'm up to:
👨‍💼 Blog: zoranjambor.com
💼 LinkedIn: linkedin.com/in/zoranjambor

- Zoran Jambor
#css #vscode