/* you can put this line in your .css Change the width,
border etc and colour to your liking*/
hr {
width: 10%;
border: 10px dotted;
border-style: none none dotted;
color: grey
}
hr {
border:none;
border-top:1px dashed #f00;
color:#fff;
background-color:#fff;
height:1px;
width:50%;
}/* hr {
border:none;
border-top:1px dotted #f00;
color:#fff;
background-color:#fff;
height:1px;
width:50%;
} *//*Here the syntax for border-style works clockwise therefore, the top has the value dotted
and the right has value assigned none and then comes the bottom and then finally the left*/
hr {
border: 6px dotted;
border-style: dotted none none none;
height: 2px;
width: 8%;
color: grey;
}