SPAN with display block

Question

What is the difference between the default <div> element and the default <span> element with display: block?

Answer 1

There is a difference with regards to validity and semantics of HTML elements. Otherwise they are identical.

• div and span are both defined as generic containers without deeper meaning in terms of HTML. The one defaulting to block display, the other to inline, since these are the two major groups where almost any other element falls into

• Certain elements must be contained by an element that is defined as a block. This has nothing to do with the CSS display property, but with the semantics of HTML: The general idea is based on inlines being always children of blocks (which is, if you think of it, a good idea in general)

• Now, if you have a span with display:block, it will, in the sense of CSS, act exactly like a div. However, from the semantic point of view, if you embed block level elements inside the span, you are creating invalid HTML, because you nest a block in an inline element.