Print Css not loading

Question

I am trying to load my print.css but it does not seem to be loading. it work Fine in FF and Safari but the problem is only in IE.

I have the regular external css for the page inbetween the head tags

And when the user click on the print link . it loads the print css .

<div class="linkPrint">
<a target="_blank" href="?format=print">Print</a>
</div>


var format = getUrlParam('format');
if (format == 'print') {
    $('head').append('<link href="/theme/print.css" rel="stylesheet" type="text/css" />');
}

But,in IE it load the standard css instead of the print.css.

How do can this be fixed for IE6?

Thanks

What happens if you use standard DOM methods like document.createElement("link"), etc., and append that to the head? — Marcel Korpel
– Marcel Korpel, Commented Jun 25, 2010 at 21:47

Oded · Accepted Answer · 2010-06-25 21:26:29Z

7

You can have the print CSS and your screen CSS both loaded at the same time on the page without them interfering with each other - you need to specify the media attribute on the link tag:

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

No need to go through the javascript trickery.

As for IE6 - it does support this, as can be seen on the comparison list on this page.

edited Jun 25, 2010 at 21:26

answered Jun 25, 2010 at 21:10

Oded

501k102 gold badges900 silver badges1k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user244394 Over a year ago

Thanks yes that one way. But I cant use that in this case. How can this work in IE6 using the above javascript, it work fine in FF and Safari and Crome, but fails in IE6

Oded Over a year ago

How come you can't use this, but can use a javascript hack?

Mark Pope · Accepted Answer · 2010-06-25 21:56:17Z

0

Try removing the <link> to the other css file when you append the print.css

answered Jun 25, 2010 at 21:56

Mark Pope

11.3k11 gold badges51 silver badges59 bronze badges

Comments

eos87 · Accepted Answer · 2010-06-25 22:53:25Z

0

try with document.write,

document.write('<link href="/theme/print.css" rel="stylesheet" type="text/css" />');

answered Jun 25, 2010 at 22:53

eos87

9,41313 gold badges51 silver badges77 bronze badges

Collectives™ on Stack Overflow

Print Css not loading

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related