Question

How to create a horizontal line in CSS?

I’m trying to add a horizontal line to my webpage using CSS for styling. What’s the best way to do this? Are there specific CSS properties I can use to customize its width, color, or style? Any tips for creating a line that fits well with the rest of the design would be appreciated

Answer 1

The most basic way to create a horizontal line in HTML is using <hr> tag. The <hr> tag adds a simple, horizontal line across the page, it is used to separate content sections.
you can style the <hr> tag to customize its look, like changing the color, width, or thickness in the CSS file later.

<hr class="styled-line">

.styled-line {
  border: 0;
  height: 2px;           
  background-color: #333; 
  width: 80%;             
  margin: 20px auto;     
}