If you wanted to wrap it with more than one tag and include a class, you can provide an Emmet abbreviation such as main>div.container, which will give you HTML like this: You will be prompted for an abbreviation, you can just type the name of the tag you want. Select the code you want and run the command Emmet: wrap with abbreviation. html tag wrapper (165K installs): “wrap selected html tag by press ctrl+i, you can change the wrapper tag name simply too.”Įmmet can do this for you.

htmltagwrap (277K installs): “Wraps selected code with HTML tags”.It would be nice to just select the block and run a command to wrap it with the main tags. Then, we need to go to line 26 and type out the closing main tag. If we have auto closing tags setting turned on, we may have to delete this closing tag. This is awkward to do manually.įor example, in the code below, to wrap the 3 div elements in a main element, we would need to go to line 10 and type out an opening main tag. Sometimes, you want to wrap a block of HTML with another element when you are refactoring your HTML. There are builtin features and settings that ably do the work of many popular extensions.

This follows on from the post VS Code: You don’t need that extension that I wrote last year.

Visual studio code auto indent