Using abbreviations for long CSS properties in VS Code
So, I just learned about this neat little trick in VS Code where you can use abbreviations for long CSS properties and it will automatically expand them into their full form. This is a built-in feature in VS Code and you don’t need to install any extension for this.
It’s essentially a part of Emmet which is a plugin for many popular text editors which greatly improves HTML & CSS workflow.
For instance, if you type
df and hit Tab, it will expand into
Similarly, if you type
aic and hit Tab, it will expand into
It works for a lot of CSS properties. You “just” need to be a little more specific in case you don’t get your desired result.
Here’s a video of it in action.
I think this is pretty handy since it saves you a lot of keystrokes and time.
Like this article? Consider leaving aTip