React to Print: Hide Scroll Bar from the print page

React to Print is an amazing library for React users for setting up printing a page or div section. If the print content section is having a scroll bar then you may face an issue on the print page.

The issue is nothing but the scroll bar gets shown on the print page. Which makes the print look a little ugly so we want to get rid of the scroll bar. We can achieve that by hiding the scroll bar using some CSS trick.

How to hide Scroll Bar from the Print Contents

We can easily hide the scroll bar from the print contents by using a CSS trick.

@media print {

  ::-webkit-scrollbar {
    display: none;
  }
}

You can add the above code to your CSS file so it will hide the scroll bar from the print contents. So we can easily get the scroll bar removed from our print page and have a nice printing.