T
7

Stumbled on a keyboard shortcut for VS Code that saved me 20 minutes of clicking around

After 3 hours of messing up my CSS grid alignment yesterday, I accidentally pressed Ctrl+Shift+P and found the 'Emmet Wrap with Abbreviation' feature that just wrapped all my elements in a div instantly, and honestly has anyone else had a random shortcut fix their whole workflow by accident?
2 comments

Log in to join the discussion

Log In
2 Comments
christopher385
Dude yes, that accidental shortcut discovery is basically a rite of passage for anyone using VS Code. The Emmet wrap thing is a lifesaver but also easy to forget about if you don't use it every day. For CSS grid stuff specifically, the thing that saved me was the 'Toggle Grid' view in the debugger panel. You click that little grid icon in the Elements tab and it shows all your lines and gaps right on the page, and it really helped me spot where my spacing was breaking. Another trick is using Ctrl+D to select the next matching word, which makes renaming classes or variables way faster than doing it one by one. If you keep hitting weird layout issues, the 'Cmd+Shift+O' symbol search is also good for jumping to specific CSS rules without scrolling through a huge file. Have you tried the multi-cursor thing yet for editing multiple lines at once?
3
butler.brian
Oh man, I spent an entire afternoon once manually typing out
tags for like 50 elements because I didn't know about multi-cursor. Then I accidentally clicked the mouse wheel while holding Alt and it selected everything at once. Felt like an idiot but also like a genius at the same time. These happy accidents are the only way I learn new shortcuts apparently.
2