Scroll bars showing on printed page in IE9?

Question

I'm having an issue with IE9 showing horizontal scroll bars on a printed page even though the contents of the page fit entirely. I've tried several things to remove them in my print css. Has anyone else had this issue and found a way around it?

Obese

have you tried overflow: hidden? – Poach

Yes. I've also hidden everything on the page and the scroll bars still appear. – Obese

is this in print preview or in the printed page itself? – Poach

Have you tried to style scrollbars? my guess is that IE still support that.. but are you sure you applied overflow:hidden to the right element? or is in a frame or something? May be it's an advertismenet with bad css? – Corneliacornelian

It would be of much help if you provided a link or screenshot of your current issue. – Fabrianna

Answer 1

I faced the same issue. It is a funny fix. Define the overflow property as important. It works. LOL on IE.

overflow:hidden !important;

Hepatitis

Also worth noting is that you could use overflow:visible!important; too. This also gets rid of the scrollbars but shows any content outside. – Keewatin

Answer 2

I have had this issue several times with IE in the past. It is usually a margin issue. Different browsers calculate margins differently. How are you positioning the elements? Do you have a fixed-width wrapper around the content or does the body expand to the browser width? It's really difficult to pinpoint the problem without the actual css code.

I would suggest removing any negative margins you have (IE does not like these), and check to see if you have any right margins on elements that are unnecessary.

Comely

Answer 3

@media print{

    .dont-print
     {
        overflow:hidden;
     }

}

dont-print is just a class name which i've used before, changed that to whatever you need

Nelidanelie

Answer 4

Use following code on body tag in JavaScript function print:

printWin.document.write(
  '<style>div {overflow: visible !important; height:auto !important;}</style>'
);

Money

Answer 5

Are you sure you set the right stylesheet media type? Like:

<link rel="stylesheet" href="print.css" type="text/css" media="print" />`

And try the following in your print.css:

html, body { overflow-x: hidden; }

Essayist

Instead you can try: html, body { overflow: auto; } – Judaea