Inline HTML elements do not force a line break before or after them. It seems common sense to say it but the content of an inline element flows from left to right, as opposed to the block elements that flow down the page.
Two most common inline element you will use are the <a> anchor tag, for adding hyperlinks and <span> for grouping content. We'll discuss both later but for now we'll consider <strong> and <em>.
Importance with <strong>
The <strong> element when added will make text bold. In truth this is just its default behaviour as the tag is about the importance of its content not its appearance. If the text is importance put it in a <strong> tag (it just happens to be bold by default).
Note: If you want something to be in bold use the CSS property font-weight.
Emphasis with <em>
Similarly, the <em> element when added will make text italic. Again this is just its default behaviour as the tag is about given the content emphasis not its appearance. If the text requires emphasis put it in a <em> tag (it just happens to be italic by default).
Tip: If you want something to be in italics use the CSS property font-style.
Well Formed HTML
Not something you will do often, but it is useful to use <strong> and <em> to consider 'well formed' HTML.
Challenge: Why is this code not good?
The problem is that the <strong> and <em> are incorrectly nested. As <strong> is opened last it should be closed first. A 'well formed' version of the above would be:
Legacy / Deprecated Elements
There are still legacy tags <b> and <i> that you sometimes see in the place of <strong> and <em>. These are still supported by browsers but are generally best avoided.
Warning:
Deprecated elements are ones that are no longer formally in the HTML standard. Ones to avoid (that will definitely be red pen territory are <center> and <font>. The presentation role of these, centring text and setting fonts respectively, should be done through CSS not the HTML