HTML formatting in Visual Studio 2010

Question

Whenever I reformat html source code in Visual Studio with Ctrl-K, Ctrl-D it formats my source code like this:

<p>
    text</p>
<p>
    more text</p>

How can I make it use the following format instead?

<p>
    text
</p>
<p>
    more text
</p>

I know that there are settings at Options-> Text Editor -> Html -> Formatting, but I could not find suitable there.

Thanks,

Adrian

Edit: I've checked the tag-specific settings, and page break for p tags is set to "Before opening, within, and after closing". Also, the little preview shows exactly the format I want to have. But Visual Studio still does it wrong. Could this have anything to do with Resharper being installed on my system?

Answer 1

The problem has nothing to do with ReSharper. This is a feature by design of the Visual Studio Source Formatter where it will attempt not to change the semantics of an element due to formatting options that you specify.

So, you specified that you want the p tags to have breaks within the content, but a break after a p tag would change the semantics of the content within the tag, thus the formatter ends up putting the closing p tag right after the content. To have the closing tag on a separate line you will need to explicitly add a space just before the end of the content and the closing tag.

Thus:

<p>content</p>

will produce:

<p>
   content</p>

While (note the explicit inclusion of a space between the content and the closing p tag):

<p>content </p>

will produce:

<p>
   content
</p>

This is discussed in a blog post by Scott Guthrie in the 3rd paragraph from the bottom. Start counting from the paragraph right above the additional links section.

Answer 2

Click Tools, Options, Text Editor, HTML, Formatting, Tag Specific Options.
Add a new Client-side tag for p (if it's not there already) and select Separate Closing tag and Before, within, and after closing.