Lord have mercy on Lebanon. If you have anyone in Lebanon check on them. Pray for Lebanon 🙏🙏🙏
How to style an hr element using CSS

In this post, you will learn how you can use the border property in CSS to style an hr element.

To make every thing easy we are just going to give each hr(horizontal line) element a class as shown in the code snippet below.

Watch the tutorial to follow STEP by STEP.

Hr (Horizontal Line) Mark Up


<p>Styled ones</p>
<hr class="one">
<hr class="two">
<hr class="three">
<hr class="four">

Hr styling code

Here we select each hr element using the class given to each. For example one, two, three, four, respectively.


	border-top:1px solid teal;

	border-top:1px dashed green;

	border-top:2px dotted red;

	border-top:5px solid teal;
	border-radius: 5px;

I will always put out free content on my YouTube Channel, but showing your support, subscribing to it, pushes me and gives me motivation, not because of the money, but because it feels like people really appreciate what I do. SUBSCRIBE TO:: Oston Code Cypher

Related Post(s)

» How do I wrap text in a pre tag?[SOLVED]

» How to use the CSS Negation and Language Selectors.

» How to create a Fullscreen Background Video(Source Code)

» How to center anything on a wepage using CSS

» Learn how to create Gradient Backgrounds using CSS

collections_bookmark Category :: Css
date_range Published :: 8 months ago At: 05:46 PM
event_note Detailed Date :: Nov 27th, 2019
person Writer :: Code