How to print scrollable DIV content

Make all parents visible

I've struggled some hours with this and finally noticed the problem was that some of the parent tags where preventing the div to be fully visible, and instead a scrollbar from some parent tags was being visible on the print.

So the final effective solution was to apply all the rules (mentioned in other answers) to all possible parent tags that could be in the middle, including also an !important rule so they wouldn't be bypassed.

Like this:

@media print {
  body, .CLASS-of-parent-tag, #ID-of-div-with-long-content {
    display: block !important;
    position: relative !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    margin-left: 0 !important;
  }
}

This applies for almost any case in my projects.

Without seeing the page or knowing its layout, it's hard to know what to suggest that won't look horrible.

But, if hiding all other content (in a print stylesheet, I assume) works, you may then be able add:

@media only print {
   #idOfYourDiv {
     width: auto;
     height: auto;
     overflow: visible;
   }
}

to show all the contents at once.

I'm not sure what website you're using - but in IE you can open up F12 Developer tools, find the div you want to display, and modify the style on the fly:

{
    display: block;
    width: auto;
    height: auto;
    overflow: visible;
}

It would then cause the div to display all it's content, without scrollbars... hopefully this helps!