Most of elements in html can be divided in to categories: inline and block. For exemple a <div> tag is a block element and a <a> tag is an inline element.

If you don’t see the difference between the <a> and <div> tags in terms of nature you need to read the follow. Understanding the differences and write your code properly with those difference will spare you time during the validation but also during the designing.

Block element:

Block element are meant to structure your document. They are usually container for other elements like other block elements or inline elements. By default a block element takes the full horizontal space allowed in his container and his dimensions may be redefined (width, height).

Inline element:

Inline element are meant to contain text or other inline element. It is not valid nor semantically correct to display block element in inline element. Inline element takes the less space they can and you may not redefine their dimensions unless you change their css property display to block. (doesn’t work for all inline element)

examples:

<p><a href="#"></a></p>

This is correct, the <p> element is a block element, it can contain inline element like

<ul><li><p>text</p></li></ul>

This is incorrect, the <li> is an inline element, it shouldn’t contain a block tag like <p>.

You might find this very basic but a lot of website are still coded without any respect of the nature of the tags…