[thelist] Text area contents are not printing completely

Deepak Panchal deepakaus at hotmail.com
Tue Mar 21 20:23:49 CST 2006


Gecko-based browsers like Netscape 6.x or Mozilla have a problem with
printing long floated elements. If a floated element runs past the
bottom of a printed page, the rest of the float will effectively
disappear, as it won't be printed on the next page.
 
My website has a textarea which has a large contents in it say about two
pages. I used CSS to create my website. 
 
I am aware of the print.css and the float: none stuff which is used to
print complete content in the next page. but still it is not printing
complete text of the textarea. I am using win-xp and Internet explorer
6.
 
In my website, entire content is contained in one big text area. Which
is then printed but it prints only the first page and rest of the pages
are blank. 
 
I also using float:none in print.css. Please have a look at the
following code of Assessment.htm, print.css and main.css:
 
Assessment.htm has textarea as follows:
            
<html>
<head>            
 
            <LINK href="main.css" rel="stylesheet" type="text/css" />
            <LINK href="print.css" rel="stylesheet" type"text/css"
media="print">
 
            <style type="text/css">
                        /*<![CDATA[*/
                                    textarea {
                                                height: 100%;
 
                                    }
                        /*]]>*/
            </style>
 
 
</head>
<body>
 
 
 
            <TEXTAREA  id="tarea"  cols="61" style="WIDTH:500; "
readonly="readonly" > TEXT IS HERE - MORE THAN ONE PAGE </TEXTAREA>
            
            <div id="tbutton">
                        <button onClick="window.print();" style= "width:
100px; height: 25px;" ><font face="Verdana"  color="black"
size="1">Print</font></button>
            </div>
</body>
</html>
 
main.css has following:
 
            #tarea{ 
                        font-family: "Verdana", Tahoma, Arial,
Helvetica, sans-serif; 
                        font-size: 11px; 
                        border:0px none;
                        color:#0000;
                        padding:0;
                        margin:0
                        float: none !important;
 
            }
            #tbutton{ 
                        padding: 0px 0px 0px 0px; 
                        float:left; 
                        border-left: 0px; 
                        height: 30px; 
                        width:110px !important; 
                        width /**/:110px; 
            }
 
print.css has following:
            #tarea {
                        width: auto; 
                        margin: 0;
                        padding: 0; 
                        border: 0;
                        float: none !important;
                        color: black; 
                        background: transparent;
                        font-family: "Verdana", Tahoma, Arial,
Helvetica, sans-serif; 
                        font-size: 7pt;
            }
            #tbutton {
                        display: none;
            }
 
When we print this assessment.htm, it prints only one page and prints
other pages blank.
 
Do you have any solution for this?
 
-Deepak Panchal
 



More information about the thelist mailing list