How-to articles, tricks, and solutions about PSEUDO-ELEMENTS

How to Add Line Break Before an Element with CSS

In this tutorial, we’re going to show some ways of adding a line break before an element. For that, use the white-space property and ::before pseudo-element.

How to Add Lines Before and After the Heading Text

If you are tired of standard heading styles then read this snippet and learn to add lines before and after heading giving it an attractive and unique style.

How to Break Line Without Using <br> Tag in CSS

There are a few ways to break a line without using a <br> tag. For that, we can use the white-space and display properties, as well as pseudo-elements.

How to Center a Text Inside the CSS :before Pseudo-Element

In this snippet, you will find out how it is possible to center a text within the CSS :before pseudo-element. Try an example and find its description to make it clear.

How to Change the Color of the First Word in a Text

In this tutorial, you can see how to change the color of the first word of a text. For that, use the CSS :before pseudo-element with the content property.

How to Create Loading Spinner With CSS

How to Create Loading Spinner With CSS? CSS animations allow creating a loading spinner easily. Learn with W3docs online tutorial. Fast solution.

How to Cut Corners With Pure CSS

If you want your Website to look creative, then read our snippet and learn how to get a cut corner effect using different methods and try some examples.

How to Limit Border Length with CSS

You may come across the difficulty of making the border of an element shorter than its parent element. To overcome this, use CSS properties and HTML elements.

How to Select and Manipulate CSS pseudo-elements using jQuery

Read this tutorial and learn the simplest and fastest way of selecting and manipulating the CSS pseudo elements using some jQuery and CSS methods.