How to create a dotted <hr/> tag?

HtmlCss

Html Problem Overview

How can I create a dotted or any type of hr line (double, dashed etc.) using CSS?

<hr style="...what should I write?..." />

or is there any other trick?

Html Solutions

Solution 1 - Html

You could just have <hr style="border-top: dotted 1px;" /> . That should work.

Solution 2 - Html

hr {
    border-top:1px dotted #000;
    /*Rest of stuff here*/
}

Solution 3 - Html

hr {
	border: 1px dotted #ff0000;
	border-style: none none dotted; 
	color: #fff; 
	background-color: #fff;
}

Try this

Solution 4 - Html

You can do:

<hr style="border: 1px dashed black;" />

Demo: http://jsfiddle.net/JMfC9/

Solution 5 - Html

The <hr> tag is just a short element with a border:

<hr style="border-style: dotted;" />

Solution 6 - Html

You can do:

<hr style="border-bottom: dotted 1px #000" />
Categories
Recommended Html Solutions
Recommended Css Solutions

Previous Solution:

When do I have to use interfaces instead of abstract classes?

JavaOopInheritanceInterfaceAbstract Class

Next Solution:

How do I select an element that has a certain class?

HtmlCssSyntaxCss Selectors

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionAmin SaqiView Question on Stackoverflow
Solution 1 - HtmlAnnishView Answer on Stackoverflow
Solution 2 - Htmluser2406160View Answer on Stackoverflow
Solution 3 - HtmlZazikiView Answer on Stackoverflow
Solution 4 - HtmltymeJVView Answer on Stackoverflow
Solution 5 - HtmlBlenderView Answer on Stackoverflow
Solution 6 - HtmlkarthikrView Answer on Stackoverflow