How to print dashed or dotted lines of css in pdf?

Question

I am trying to make a webpage using HTML and CSS but when I'm trying to print the page the dotted lines become straight.

CSS

.box-heading {
    padding-top: 10px;
    border-top:.5pt dotted black;
    text-align: center;
    border-bottom:.5pt dotted black;
    padding-bottom: 8px;
    margin-bottom: 24px;
}

When I am printing the dotted line become straight.

Answer 1

Probably the issue is in your print settings.

The ideal page size for a webpage is A4.

If you use any other size it will modify the original pixels and this may be the reason you are getting a straight line instead of a dotted line.