Working with the display property in CSS

You already know that all tags belong to a certain block model. If you want, however, you can change the model using the display property. Using the block value of this property, you can make the element block-level, and using the inline value, you can make it inline-level.

Let's make the span tags behave like block elements:

<span>text</span>
<span>text</span>
<span>text</span>

span {
	display: block;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-bottom: 20px;
}

Now let's make the div tags behave like lowercase:

<div>text</div>
<div>text</div>
<div>text</div>

div {
	display: inline;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Let's say you have several paragraphs in your HTML code. Make them behave like inline elements.

Let's say you have several links in your HTML code. Make them behave like block elements. Give them a border, width, and height.