How To Create A Dotted

---

Tag? [duplicate] - Stack Overflow

Just browsing Stack Overflow? Help us improve your experience. Sign up for research

1. 1. Home
   2. Questions
   3. Tags
   4. Users
   5. Companies
   6. Labs
   7. Jobs
   8. Discussions
   9. Collectives

   10. Communities for your favorite technologies. Explore all Collectives

2. Teams

   Ask questions, find answers and collaborate at work with Stack Overflow for Teams.

   Try Teams for free Explore Teams
3. Teams

4. Ask questions, find answers and collaborate at work with Stack Overflow for Teams. Explore Teams

Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

Get early access and see previews of new features.

Learn more about Labs How to create a dotted <hr/> tag? [duplicate] Ask Question Asked 11 years, 6 months ago Modified 10 years, 3 months ago Viewed 330k times 100 This question already has answers here: How to draw a dotted line with css? (18 answers) Closed 11 years ago.

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
• css

Share Improve this question Follow edited Aug 18, 2014 at 2:57 Always Learning Forever 81811 gold badge88 silver badges2626 bronze badges asked May 29, 2013 at 16:59 Amin SaqiAmin Saqi 18.9k99 gold badges5252 silver badges7070 bronze badges 1

• tips: If you want to make multiple dotted lines, you can duplicate it with JavaScript – Ooker Commented Jan 19, 2021 at 17:10

Add a comment |

6 Answers 6

Sorted by: Reset to default Highest score (default) Trending (recent votes count more) Date modified (newest first) Date created (oldest first) 183

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

Share Improve this answer Follow answered May 29, 2013 at 17:02 AnnishAnnish 2,17511 gold badge1414 silver badges1818 bronze badges 2

• 6 Looks awful, one line straight, the other one dotted. – Jose Manuel Abarca Rodríguez Commented Feb 17, 2022 at 17:23
• 7 Set background-color: transparent to remove the straight line – Francisco Gomes Commented Oct 29, 2022 at 18:06

Add a comment | 32 hr { border-top:1px dotted #000; /*Rest of stuff here*/ } Share Improve this answer Follow answered May 29, 2013 at 17:01 user2406160user2406160 53833 silver badges88 bronze badges Add a comment | 24 hr { border: 1px dotted #ff0000; border-style: none none dotted; color: #fff; background-color: #fff; }

Try this

Share Improve this answer Follow answered May 29, 2013 at 17:04 ZazikiZaziki 41822 silver badges1212 bronze badges Add a comment | 18

You can do:

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

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

Share Improve this answer Follow answered May 29, 2013 at 17:01 tymeJVtymeJV 105k1414 gold badges164164 silver badges158158 bronze badges Add a comment | 10

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

<hr style="border-style: dotted;" /> Share Improve this answer Follow answered May 29, 2013 at 17:01 BlenderBlender 297k5555 gold badges457457 silver badges510510 bronze badges Add a comment | 8

You can do:

<hr style="border-bottom: dotted 1px #000" /> Share Improve this answer Follow answered May 29, 2013 at 17:02 karthikrkarthikr 99.5k2626 gold badges207207 silver badges191191 bronze badges Add a comment |

Not the answer you're looking for? Browse other questions tagged

• html
• css

or ask your own question.

• The Overflow Blog
• Your docs are your infrastructure
• Featured on Meta
• More network sites to see advertising test [updated with phase 2]
• We’re (finally!) going to the cloud!
• Call for testers for an early access release of a Stack Overflow extension...

Linked

130 How to draw a dotted line with css? 15 How to duplicate a div in JavaScript -1 How to divide <hr> into multiple parts?

Related

3441 How can I change an element's class with JavaScript? 1650 How do I style a <select> dropdown with only CSS? 5104 How can I horizontally center an element? 1368 How can I write 'a:hover' in inline CSS? 6129 How to disable text selection highlighting 2070 How do I make a placeholder for a 'select' box? 3095 How to store objects in HTML5 localStorage/sessionStorage 1463 Maintain the aspect ratio of a div with CSS 1463 How to align content of a div to the bottom 2003 Transitions on the CSS display property

Hot Network Questions

• Why linear regression doing well in time series data?
• Can I use the NEEWER QPRO-N on Canon R6 with NEEWER Z2-C 2,4G TTL Flash units if I don't need ETTL?
• How do I remove a hat from my horse?
• Can this strong directional blur at wide apertures still be explained by the usual arguments?
• Hearing the cry of a baby - abandoning practice for action?
• Nonnegative functions with minimum constantly equal to 0
• Why is a pure copper cathode necessary in the electrolytic refining of copper?
• How does this AM modulator work
• Where can I find an up-to-date map of Stockholm Central Station that shows the platform layout?
• Efficiency of Coaxial Rotors vs Single Rotors (and Contrarotating Propellers)
• Meaning of "I love my love with an S—" in Richard Burton's "Arabian Nights"
• Should I ask for physical recommendation letters now to avoid future issues with professors' availability?
• Is Holy Terra Earth?
• Is there a commonly used expression for adjusting a training or form of support to a person's specific situation and needs?
• Importing gzipped CSV files in QGIS
• Are mental images of mathematical entities persistent?
• Does length contraction "break the speed limit"?
• Why does Japanese not have a native "tu" sound?
• What powers do police have to force people onto trains?
• Mirroring/reflection of long texts
• When did Storm Troopers stop being clones?
• T47 to BSA bottom bracket adapter - good idea?
• Angular orientation of exact solution of the Hydrogen Schrödinger Equation
• Mega Man: Powered Up

more hot questions lang-html