CSS Selectors like :after, :before not shown by printing

Issue

i am coding and designing an applicaition and i want that the screen mode looks in print mode same.

Here is a screenshot of the screen version:

And here ist a screenshot of the print version (e.g. on Chrome):

The timeline stripe is set by :before and that won't be printed.

Have someone an idea or an solution? Have someone a guide for css print rules?

Solution

Try to put your css rules inside print media query:

@media print {
  h2 { 
    font-size: 14px;
  }
}

Answered By - Caio Kawasaki