How to use CSS to add a line break before or after a particular inline block item?

Sometimes, we want to use CSS to add a line break before or after a particular inline block item.

In this article, we’ll look at how to use CSS to add a line break before or after a particular inline block item.

How to use CSS to add a line break before or after a particular inline block item?

To use CSS to add a line break before or after a particular inline block item, we use the content property.

For instance, we write

li {
  display: inline;
}
li:nth-child(3):after {
  content: "\A";
  white-space: pre;
}

to make li elements display inline.

Then we add a new line after the 3rd li with content: "\A"; and white-space: pre;.

Conclusion

To use CSS to add a line break before or after a particular inline block item, we use the content property.