Block-Level Elements
A block-level element creates breaks before and after the element box.
The p and div elements are block-level element by default.
span is by default is a inline element, which should not have breaks before and after. The following CSS add breaks to span by setting its display type to block.
<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
<style type="text/css">
p {border: medium solid black}
span {
display: block;
border: medium double black;
margin: 2px;
}
</style>
</head>
<body>
<p>
HyperText Markup Language <span>(HTML)</span> is the main markup language for
displaying web pages and other information that can be displayed
in a web browser(From From Wikipedia, the free encyclopedia).
</p>
<p>
HyperText Markup Language (HTML) is the main markup language for
displaying web pages and other information that can be displayed
in a web browser(From From Wikipedia, the free encyclopedia).
</p>
</body>
</html>
Home
HTML CSS Book
CSS
HTML CSS Book
CSS
display:
- Block-Level Elements
- Inline-Level Elements
- inline-block
- Run-In Elements
- Hiding Elements
Related: