Using the <p> tag and <br> tag in Expression Web

The <p> tag is used to indicate paragraphs. The <br> tag is used to insert line breaks, not to create paragraphs.

HTML <p> Tag

The <p> tag defines a paragraph. We, as authors, tend to use paragraphs to divide our streams of thoughts into sections.

The p element automatically creates some space before and after itself. The space is automatically applied by the browser, or you can specify it in a style sheet. As an example, the footer at the bottom of this page uses the <p> tags to separate the various lines which would normally appear with spaces in between each line.

<div id="footer'>
<p>Copyright © 2008 - 2011 Expression Web Tutorials and Templates - Pat Geary - All Rights Reserved</p>
<p>Site Design <a title="Genealogy Web Creations." href="http://www.genealogy-web-creations.com/">Genealogy Web Creations</a> | <a title="Privacy Policy for Expression Web Tutorials &amp; Templates." href="privacy-policy.html">Privacy Policy</a></p>
<p><a title="Expression Web Tips Blog." href="http://www.expression-web-tips.com/">Expression Web Tips Blog</a> </p>
<p>Microsoft® and Expression Web® are registered trademarks of Microsoft® Corporation.</p>
</div>

To change the formatting of the <p> tag in just the footer id, I added the following style rules to my external style sheet:

#footer p {
margin-top: 0px;
margin-bottom: 0px;
}

Read more about styling the <p> tag  CSS Margins

If you are working in Design View in Expression Web and hit the Enter key, a <p> tag is inserted. If you have a line of text that is not surrounded by the <p> tag, you can highlight the text and select paragraph from the dropdown on the standard toolbar.

If you are working in Code View in Expression Web and use the Enter key, the <p> tag is NOT inserted for you. You can use Intellisense in Code View and type with opening carat < and p and the closing carat > and the closing tag </p> will be inserted for you.

I tend to use browser defaults for styling my <p> tag.

HTML <br> Tag

The <br> tag inserts a line break BUT does not add extra space before the new line.

If you are using the HTML doctype, the <br> tag has no end tag. If, however, you are using the  XHTML doctype,  the <br> tag must be properly closed, like this: <br >.

If you are working in Design View in Expression Web and use the Shift + Enter key, a line break will be inserted.

If you are working in Code View in Expression Web and use the Shift + Enter key, the <br> tag is NOT inserted. You can use Intellisense in Code View to insert the <br> tag.

The <br> tag should also NOT be used to create a list of items. Instead use an ordered or unordered list to create you list items. You can create specific style rules for your lists to remove the numbers or bullets if you so desire.

The menu on the left hand side of this page as well as the top of the page iwas created using an unordered list with style rules applied.