When learning a new language you always get stuck on a few things and when I first started learning HTML it was the div and span tags that gave me a hard time. I couldn’t really figure out the difference between the two especially with block-level and inline. But after practicing and using it with my code I’m going to tell you the key difference between the two using html.
For starters the div is a block-level element. This type of element begins on a new line and takes up the full width. Span is an inline element and this means it stays on the same line and takes up the necessary width.
Notice in this example how the text highlighted is the div element which started in a new line occupying full width and now contains 3 blocks.
Changing it to span allows the text to be continuous and does not have any change on the width or block.
So remember that span is an inline element used for taking up the space bounded by its opening and closing tag and div is a block-level element that always start on a new line and takes up the full width of the page.
Top comments (0)