Remember, Element is just another word for Tag.In HTML, the concept of block-level elements and inline elements is important for structuring your code and passing a syntax check.
Block-level elements: always start a new line, and often modify large amounts of, or significant, information.
A block element is an element that takes up the full width available, and has a line break before and after it. (http://www.w3schools.com/css/css_display_visibility.asp)
An inline element only takes up as much width as necessary, and does not force line breaks. (http://www.w3schools.com/css/css_display_visibility.asp)
However, the rules around block-level elements vs inline elements take a little while to absorb. So, first you need to be clear about which tags are block-level and which are inline, and then you need to learn a few rules about which tags are allowed inside one another.
The information below is not meant to be exhaustive, or to substitute for use of a good HTML5 online reference or HTML5 book and/or BBEdit's syntax check.
<p> </p> <h1> </h1> down to... <h6> </h6> <blockquote> </blockquote> <hr> <pre> </pre> <div> </div> lists tables
<br> <b> </b> <i> </i> <u> </u> <s> </s> <a href=""> </a> <a id=""> </a> <img src="" alt="" width="" height=""> <sub> </sub> <sup> </sup> <span> </span>
- Block-level tags can contain Inline tags.
- The reverse is not true -- inline tags cannot contain block-level tags.
- Some block-level elements can contain some other block-level elements.
You can use a Syntax Check to help you determine if you are understanding the rules governing interactions between block-level and inline tags in HTML5. Reading the errors you get, plus a little experimentation (and sometimes reference to a good online HTML5 reference or a book) will help you sort out syntax errors. Use BBEdit's Syntax Check (see my notes about how to do a BBEdit syntax check)
or see Online W3C HTML syntax check.