4

I want to print my html page into a PDF file, but don't want the scroll bar showing there in the PDF file. And my page have a scrollable body, so if I set this:

* {
   overflow: hidden;
}

The body will be incomplete in the final pdf file. So if there is a way just prevent the scrollbar from showing but the content still scrollable?

David LIu
  • 299
  • 2
  • 4
  • 21

2 Answers2

10

You can set display of scrollbar to none by:

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

This will hide all the scrollbars without disabling scrolling.

Edit: this only works on chrome, for a better explanation you can check this answer Hidding Scrollbar

Community
  • 1
  • 1
Hue
  • 183
  • 1
  • 9
8

There is a CSS rule that can hide scrollbars in Webkit-based browsers (Chrome and Safari). That rule is: 

.element::-webkit-scrollbar { width: 0 !important }

There is a CSS rule that can hide scrollbars in IE 10+. That rule is: 

.element { -ms-overflow-style: none; }

There used to be a CSS rule that could hide scrollbars in Firefox, but it has since been deprecated. That rule was: 

.element { overflow: -moz-scrollbars-none; }
Ricardo Zorzo
  • 289
  • 1
  • 9