ocmara
asked on
@media in JSP page
I’m trying to use CSS to apply printer-friendly feature for different pages in my web sit but the problem is when I apply that CSS by using @media or <link element and media=”print” attribute; it seems like that changes are applying directly to my web page not only on printer-friendly page for example if I put this line
<div align="right" ><a href="javascript:Clickhere toprint()" id="TopLayer"> Click here to print</a> </div>
in my jsp page the line will never appear in my page itself :(
Notice: I have this id in CSS
#TopLayer
{
display:none;
}
Any help please?
<div align="right" ><a href="javascript:Clickhere
in my jsp page the line will never appear in my page itself :(
Notice: I have this id in CSS
#TopLayer
{
display:none;
}
Any help please?
you made display:none; how can you except that it would appear in your page.
Meritor -- If you specify a medium for a section of CSS, those styles will only apply to the specified medium... So the css within a "printer" section does not apply to the browser version
Are you sure there are no other non-print css tags that are causing the link to be hidden? If you include the entire source I can help debug.
There are 4 ways to specify the media...
1) For inline styles
<style type="text/css" media="print">
#toplayer {
...
}
</style>
2) With an external css file
<link type="text/css" rel="stylesheet" href="style.css" media="print" />
3) With an external css file (my preference over #2)
<style type="text/css" media="print">
@import 'style.css';
</style>
4) within a non-media-specific style set, that has a section for printable attributes
<style type="text/css">
#toplayer {
/*common attributes*/
}
@media print {
#toplayer {
display:none;
}
}
</style>
Hope this helps!
Are you sure there are no other non-print css tags that are causing the link to be hidden? If you include the entire source I can help debug.
There are 4 ways to specify the media...
1) For inline styles
<style type="text/css" media="print">
#toplayer {
...
}
</style>
2) With an external css file
<link type="text/css" rel="stylesheet" href="style.css" media="print" />
3) With an external css file (my preference over #2)
<style type="text/css" media="print">
@import 'style.css';
</style>
4) within a non-media-specific style set, that has a section for printable attributes
<style type="text/css">
#toplayer {
/*common attributes*/
}
@media print {
#toplayer {
display:none;
}
}
</style>
Hope this helps!
ASKER
It still applies every thinks in print media section over web page still. That happen with all deferent way of specifies the print media.
I worked with WDK component, any advice!!!
I worked with WDK component, any advice!!!
Can you give a link to the actual page, or more source code so we can see what is going wrong?
ASKER
in JSP page there is
<html>
<head><dmf:webform/></head >
<body>
<table align='center'>
<div align="right" ><a href="javascript:self.prin t()" id="toplayer"> Click here to print</a> </div>
<tr><td align=left class='SHeading'>Print Friendly</td></tr>
</table>
</body>
</html>
And in a separated XML file I point to that CSS and it work fine regardless to print media. FYI:I use component approach.
<html>
<head><dmf:webform/></head
<body>
<table align='center'>
<div align="right" ><a href="javascript:self.prin
<tr><td align=left class='SHeading'>Print Friendly</td></tr>
</table>
</body>
</html>
And in a separated XML file I point to that CSS and it work fine regardless to print media. FYI:I use component approach.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.