Advanced Search

Results 1 to 10 of 10

Thread: Print DIV area inside table

  1. #1
    Join Date
    Nov 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Print DIV area inside table

    Hi,

    I am trying to print some area of Page. I tried to use the following code and it is not working inside the table. it works only if I place the DIV tage outside table. can any body help me out?

    Code:
    <style type="text/css">
    @media print {
    body * {
    display:none;
    }
    #print_div {
    display:block;
    }
    }
    </style>

  2. #2
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    Code:
    <style type="text/css" media="print">
    ...
    </style>
    use a separate stylesheet for printing


    whatever your top level element is, set that to none, setting the body * is blotchy and may not even work in IE, but definitely shouldn't work in standard browsers.

    Code:
    <head>
    <style type="text/css" media="print">
    table#container {display:none}
    div#print_div {display:block}
    </style>
    </head>
    <body>
    
    <table id="container">
    ... stuff ...
    <tr>
    <td><div id="print_div">something</div></td>
    </tr>
    ... stuff ...
    </table>
    
    </body>

  3. #3
    Join Date
    Nov 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi boogyman,

    Thanks fore yours replay. It worked but now I am facing another problem. It is shows the text in the side of the table as it displays on the webpage. I want the printed area on the top and center of the page. Here is sample page and it shows how it prints when you will click it. Can you please help me tp prin text area properly? Thanks

    http://www.hrucat.com/contents/course.php?c_id=24

  4. #4
    Join Date
    Nov 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    My problem is solved. here is what I did. Thanks for your support.

    Code:
    <style type="text/css" media="print">
    table#hidden {display:none}
    div#print {
    	display:block;
    	left: 0px;
    	top: 0px;
    	right: 0px;
    	bottom: 0px;
    	position: absolute;
    	height: 100%;
    	width: 100%;
    }
    </style>

  5. #5
    Join Date
    Nov 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    ok my problem is solved. But I am having another issue now. I have one flash object in webpage. Now it also appears in the printing. All my text appears over that flash. It happens only in IE 6.0+, but I can print fine while I am using Firefox.

    Any Clue? you can check for problem in following URL. http://www.hrucat.com/contents/course.php?c_id=24

    Edit: Fixed broken link.
    Last edited by tech_support; 11-30-2007 at 05:14 AM.

  6. #6
    Join Date
    May 2006
    Location
    Sydney, Australia - Near the coast.
    Posts
    1,995
    Thanks
    0
    Thanked 8 Times in 7 Posts

    Default

    Try this:
    Code:
    <style type="text/css" media="print">
    table#hidden {display:none}
    div#print {
    	display:block;
    	left: 0px;
    	top: 0px;
    	right: 0px;
    	bottom: 0px;
    	position: absolute;
    	height: 100%;
    	width: 100%;
    }
    object {
    display:none;
    }
    </style>
    Peter - alotofstuffhere[dot]com - Email Me - Donate via PayPal - Got spare hardware? Donate 'em to me :) Just send me a PM.
    Currently: enjoying the early holidays :)
    Read before posting: FAQ | What you CAN'T do with JavaScript | Form Rules | Thread Title Naming Guide

  7. #7
    Join Date
    Nov 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks. Every thing is fine now. I appreciate your help and support

  8. #8
    Join Date
    Dec 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

  9. #9
    Join Date
    Mar 2006
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi,

    I am having a similar issue. I tried incorporating the ideas above.. but cannot seem to make it work as I want.
    On the page I have a javascript menu (AllWebMenu) and I do not want this printed when the part of the page between DIV tags is output. The menu is not between the DIV tags - but still prints!

    I call my linked CSS script from within a table with:-
    Code:
    <div class="print" align="center"><?php include("fixtureswinter1.html"); ?></div>
    The script is:-
    Code:
    body {
    	visibility:hidden;
    }
    
    .print {
    
    	visibility:visible;
    	width: 100%;
    	}
    
    @media print {
                * {
                    margin: 0 !important;
                    padding: 0 !important;
                }
                h1, p {
                    display: none;
                }
    			table#hidden {display:none}
    			div#print {
    				display:block;
    				left: 0px;
    				top: 0px;
    				right: 0px;
    				bottom: 0px;
    				position: absolute;
    				height: 100%;
    				width: 100%;
    			
    			}
                .scorecard form {
                    border: none;
    				width: 100%;
                }
            }
            @page {
                margin: 0;
            }
    The menu in the table is called with:-
    Code:
    <span id='awmAnchor-nkmenu'>&nbsp;</span>
    Any advice would be welcome!

    Allan

  10. #10
    Join Date
    Feb 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by boogyman View Post
    Code:
    <style type="text/css" media="print">
    ...
    </style>
    use a separate stylesheet for printing


    whatever your top level element is, set that to none, setting the body * is blotchy and may not even work in IE, but definitely shouldn't work in standard browsers.

    Code:
    <head>
    <style type="text/css" media="print">
    table#container {display:none}
    div#print_div {display:block}
    </style>
    </head>
    <body>
    
    <table id="container">
    ... stuff ...
    <tr>
    <td><div id="print_div">something</div></td>
    </tr>
    ... stuff ...
    </table>
    
    </body>
    Hi
    I used your suggestion and seem to be stuck:

    I built a css at and posted it at: http://roatan.ws/port-schedule/print.css

    I then attached the style sheet to: http://roatan.ws/port-schedule/xindex.html

    Added the script between head tags:
    </style>

    <style type="text/css" media="print">
    table#roatanportschedulefebruary {display:none}
    div#print_div {display:block}
    </style>

    Then added in the body:

    <table id="roatanportschedulefebruary">
    ... stuff ...
    <tr>
    <td><div class="style159" id="print_div">something</div></td>
    </tr>
    ... stuff ...
    </table>

    When I go to my loaded page: http://roatan.ws/port-schedule/xindex.html it does not work.

    Any help very appreciated I know I am missing the mark...

    Jim

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •