Hey guys, I have a working experience with CSS but only on design and not on how div tags are structured and interpreted. I use Dreamweaver mostly on design because I am aiming at speed.
Here's the problem. I'm trying to pull off a printing (yes, using a printer to print stuff) trick for fun with java's window.print(); and i'm running out of ideas on how to solve this. Here's a sample code I wrote for everyone:
Code:
<html>
<head>
<style type="text/css">
.printablediv {
display: none;
}
@media print {
body * {
display: none;
}
.printablediv {
display: block;
}
}
</style>
</head>
<body>
<div class="printablediv">Line 1</div>
<div>Line 2.</div>
<input type="button" onclick="window.print();" value="Print"/>
</body>
</html>
When you open this code in a browser, you will see that the text 'Line 2' and the button appears. When you click the print button, it shows a printing dialog window. If you try to print the page, or try to print preview it, you will see that the text 'Line 1' only appears. This is correct but there's a problem. If you try to apply this method in existing systems or in real applications, the div with the class printable div will more likely wrapped in another <div>. If you wrap that div and print it, the text Line 1 wont appear.
What I'm trying to achieve here is that I want to print only a div of my choice. If you're going to use this in real life applications, you're more likely working on an e-cart but this is not the case with me. You can use this method to print receipts. The only trouble you're going to have to think is the formatting to the page
Solutions, anyone?
CSS Help - <div> tags trouble
Reply With Quote
Posting Permissions
