Is there any way to stop Visual Studio from removing empty spaces after Ctrl+E+D

Question

I've got a view that has the following code:

<ul class="nav nav-tabs">
    <li class="active"><a href="#General" data-toggle="tab"><i class="icon-home"></i> General</a></li>
    <li><a href="#Background" data-toggle="tab"><i class="icon-picture"></i> Background</a></li>
    <li><a href="#FormContainer" data-toggle="tab"><i class="icon-edit"></i> Form Container</a></li>
    <li><a href="#Logo" data-toggle="tab"><i class="icon-picture"></i> Logo</a></li>
    <li><a href="#Colors" data-toggle="tab"><i class="icon-tint"></i> Colors</a></li>
    <li><a href="#Fonts" data-toggle="tab"><i class="icon-font"></i> Fonts</a></li>
</ul>

The classes and html attributes are from Twitter Bootstrap but that's not important.

After pressing Ctrl+E+D combination the following code gets changed:

<i class="icon-home"></i> General to <i class="icon-home"></i>General

I also tried putting an empty space between the <i> tags but it gets stripped out as well.

This is effectively moving the tab title closer to the icon and although it's easy to fix I don't want to have to do it every time I benefit from auto code formatting in Visual Studio.

Is there any way to change/tweak this behaviour?

Answer 1

You can play with things here :: Tools/Options/Text Editor/HTML/Formatting

You'll find it a little arduous at times to get things exactly the way you want them, but if there's a way to adjust your spacing, that would be where it is located.