By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,852 Members | 865 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,852 IT Pros & Developers. It's quick & easy.

Print CSS File

P: 2
Hi friends,
I am new to this forum...But not for programming...I want a Print CSS File to be added in my page..OK.... Here is the page and i want you friends to help me create the CSS File for the page i give here...Frankly said, i am a noob in CSS....Please help me....Here is my HTML Page and i want only the <div id="pageloader"> to be displayed..

Expand|Select|Wrap|Line Numbers
  1. <%@ page session="true" %>
  2. <%@ page import="java.util.*" %>
  3. <%@ page import="java.sql.*" %>
  4. <%@ page import="com.rajk.javacode.servlets.*" %>
  5. <%@ page import="com.rajk.javacode.servlets.dbmodel" %>
  6.  
  7. <%
  8. response.addHeader("Pragma", "No-cache");
  9. response.addHeader("Cache-Control", "no-cache");
  10. response.addDateHeader("Expires", 0);
  11. %>
  12. <html>
  13. <head>
  14. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  15. <title>Techsol India - Technology Solutions | Hardware | Software</title>
  16. <meta name="description" content="Computer hardware website">
  17. <meta name="keywords" content="computer, hardware, software">
  18. <link href="css/style.css" rel="stylesheet" type="text/css">
  19. <link rel="stylesheet" type="text/css" href="chrometheme/chromestyle.css" />
  20. <link rel="stylesheet" type="text/css" href="chromejs/printStyle.css" media="print"/>
  21. <style type='text/css'>
  22. <!--
  23. .style2 {color: #FFFFFF}
  24. -->
  25. body {
  26.     font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
  27.     font-size: .8em;
  28.     }
  29.  
  30. .style3 {
  31.     color: #3333CC;
  32.     font-size: 14px;
  33. }
  34. .style420 {
  35.     border-width: thin;
  36.     border-style: solid;
  37.     border-color: orange;
  38. }
  39. .style4 {color: #FF0000}
  40. #menu1 { display : none }
  41.  
  42. a:link {color:black; text-decoration:none}
  43. a:hover {color:blue; text-decoration:italics}
  44. </style>
  45.  
  46. <script language="javascript">
  47. var yourtext = "** WELCOME TO TECHSOL INDIA! **";
  48. var wedge1="                        ";
  49. var wedge2="                        ";
  50. var message1=wedge1+yourtext+wedge2;
  51. var dir = "lside";
  52. var speed = 85;
  53.  
  54. function bouncey() {
  55.  
  56.     if (dir == "lside") {
  57.         message2=message1.substring(2,message1.length)+"  ";
  58.         window.status=message2;
  59.         setTimeout("bouncey();",speed);
  60.         message1=message2;
  61.  
  62.         if (message1.substring(0,1) == "*") {
  63.             dir="rside";
  64.         }
  65.     }
  66.  
  67.     else {
  68.         message2="  "+message1.substring(0,message1.length-2);
  69.         window.status=message2;
  70.         setTimeout("bouncey();",speed);
  71.         message1=message2;
  72.         if (message1.substring(message1.length-1,message1.length) == "*") { 
  73.             dir="lside";
  74.         }
  75.     }
  76. }
  77. bouncey();
  78. </script>
  79. <script type="text/javascript">
  80.  
  81. //New code from w3schools website
  82. var xmlHttp
  83.  
  84. function showReport(str)
  85. {
  86. xmlHttp = GetXmlHttpObject();
  87. if (xmlHttp==null)
  88.   {
  89.   alert("Your browser does not support AJAX!");
  90.   return;
  91.   } 
  92. var url="getreport2.jsp?q=";
  93. xmlHttp.onreadystatechange=stateChanged;
  94. xmlHttp.open("GET",url+escape(str),true);
  95. xmlHttp.send(null);
  96. }
  97.  
  98. function stateChanged() 
  99. if (xmlHttp.readyState==4 && xmlHttp.status==200)
  100. var results = xmlHttp.responseText;
  101. if(results!=0)
  102. {
  103. document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
  104. }
  105. else
  106. {
  107. document.getElementById("txtHint").innerHTML="No records in the database";
  108. }
  109. }
  110. }
  111.  
  112. function GetXmlHttpObject()
  113. {
  114. var xmlHttp=null;
  115. try
  116.   {
  117.   // Firefox, Opera 8.0+, Safari
  118.   xmlHttp=new XMLHttpRequest();
  119.   }
  120. catch (e)
  121.   {
  122.   // Internet Explorer
  123.   try
  124.     {
  125.     xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  126.     }
  127.   catch (e)
  128.     {
  129.     xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  130.     }
  131.   }
  132. return xmlHttp;
  133. }
  134.  
  135.  
  136. </script>
  137.  
  138. <script language="javascript">
  139. function search()
  140. {
  141. if(document.form2.input1.value!="") 
  142. {
  143. window.open("http://www.google.co.in/search?q="+document.form2.input1.value);
  144. }
  145. else
  146. {
  147. alert("Please enter something to search!!!");
  148. }
  149. }
  150. function clearthis()
  151. {
  152.     document.form2.customer.value="0";
  153. }
  154. //Right-click disabling
  155. </script>
  156. <script language="javascript" src="chromejs/datepicker.js">
  157. </script>
  158. <script language="javascript" src="chromejs/chrome.js">
  159. </script>
  160. <script language="javascript" src="chromejs/validation.js">
  161. </script>
  162. <!-- OnContextmenu denotes the right click menu
  163. <body oncontextmenu="return false;"> -->
  164. <%
  165.     String s=(String)session.getAttribute("un");
  166.     if(s==null)
  167.     {
  168.         response.sendRedirect("rmalogin.jsp");
  169.     }
  170. %>
  171. <body onLoad="clearthis()">
  172.  
  173.  
  174. <form name="form2" method="post" action="">
  175. <input type="hidden" name="hide_sess" value="<%=session.getId()%>">
  176. <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  177.   <tr>
  178.     <td valign="top">&nbsp;</td>
  179.     <td width="750" height="100%" valign="top"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  180.       <tr>
  181.         <td height="1" valign="top"><div style="position:absolute; top:25px; margin-left:590px; width:160px">
  182.         <table width="100%" border="0" cellspacing="0" cellpadding="0">
  183.   <tr>
  184.     <td class="search style2" id="search">Search Google.co.in</td>
  185.     <td>&nbsp;</td>
  186.   </tr>
  187.   <tr>
  188.     <td width="130"><input name="input1" type="text" class="login-form" value="" id="input1"></td>
  189.     <td>
  190.           <a href="javascript:search();"><img src="images/btn-ok2.gif" border="0" width="20" height="20"/></a>
  191.     </td>
  192.   </tr>
  193. </table>
  194.  
  195.         </div>
  196.         <img src="images/logo_new copy.jpg" width="750" height="175"></td>
  197.       </tr>
  198.       <tr>
  199.         <td height="100%"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  200.           <tr>
  201.             <td width="187" height="100%"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  202.               <tr>
  203.                 <td class="s-menu-head" id="categ">PRODUCT Category</td>
  204.               </tr>
  205.               <tr>
  206.                 <td><img src="images/spacer.gif" width="187" height="2"></td>
  207.               </tr>
  208.               <tr>
  209.                 <td id="menubar" height="100%"><table width="100%" height="100%" cellpadding="0" cellspacing="0" style="border:solid; border-width:1px; color:#CCCCCC">
  210.  
  211.                   <tr>
  212.                     <td height="1"><img src="images/spacer.gif" width="1" height="5"></td>
  213.                   </tr>
  214.                   <tr>
  215.                     <td height="1" class="sub"><a href="entryforms.jsp" class="sub_lnk">RMA Entry Form </a></td>
  216.                   </tr>
  217.                   <tr>
  218.                     <td height="1" class="sub"><a href="processdesc.jsp" class="sub_lnk">RMA Execution </a></td>
  219.                   </tr>
  220.                   <tr>
  221.                     <td height="1" class="sub"><a href="rmaout.jsp" class="sub_lnk">RMA Out </a></td>
  222.                   </tr>
  223.                   <tr>
  224.                     <td height="1" class="sub"><a href="instantreplaceditems.jsp" class="sub_lnk">Instant Replaced Items </a></td>
  225.                   </tr>
  226.                   <tr>
  227.                     <td height="1" class="sub">
  228.  
  229.                     <SPAN onMouseOver="document.all.menu1.style.display = 'block'" onMouseOut="document.all.menu1.style.display = 'block'">
  230.                     Reports</SPAN><BR/>
  231.                     <SPAN ID="menu1" onClick="document.all.menu1.style.display = 'none'"><br/>
  232.                         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="recfromcust.jsp" class="sub_lnk">Recieved from Customer</A><BR/>
  233.                         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="wait2send2vendor.jsp" class="sub_lnk">Waiting to Send to Vendor</A><BR/>
  234.                         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="sendtovendor.jsp" class="sub_lnk">Send to Vendor</A><BR/>
  235.                         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="wait2give2cust.jsp" class="sub_lnk">Recieved from Vendor</A><BR/>
  236.                         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="given2customer.jsp" class="sub_lnk">Given to Customer</A><br/>                        
  237.                     </SPAN>
  238.                     </td>
  239.                   </tr>
  240.                  <!-- <tr>
  241.                     <td height="1" class="sub"><a href="wait2send2vendor.jsp" class="sub_lnk">Waiting to send to Vendor </a></td>
  242.                   </tr>
  243.                   <tr>
  244.                     <td height="1" class="sub"><a href="sendtovendor.jsp" class="sub_lnk">Send to Vendor List </a></td>
  245.                   </tr>
  246.                   <tr>
  247.                     <td height="1" class="sub"><a href="wait2give2cust.jsp" class="sub_lnk">Recieved from Vendor</a></td>
  248.                   </tr>
  249.                   <tr>
  250.                     <td height="1" class="sub"><a href="given2customer.jsp" class="sub_lnk">Given to Customer </a></td>
  251.                   </tr>-->
  252.                   <tr>
  253.                    <td height="1" class="sub"><a href="snostatus.jsp" class="sub_lnk">Serial No Status  </a></td>
  254.                   </tr>
  255.                    <tr>
  256.                     <td height="1" class="sub"><a href="useradmin.jsp" class="sub_lnk">User Administration </a></td>
  257.                   </tr>
  258.  
  259.                   <tr>
  260.                     <td>&nbsp;</td>
  261.                   </tr>
  262.                 </table></td>
  263.               </tr>
  264.               <tr>
  265.                 <td><img src="images/spacer.gif" width="187" height="2"></td>
  266.               </tr>
  267.             </table></td>
  268.             <td width="1"><img src="images/spacer.gif" width="8" height="8"></td>
  269.             <td valign="top"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" id="content">
  270.               <tr>
  271.                 <td height="1"><table width="100%" border="0" cellspacing="0" cellpadding="0" hspace="0">
  272.                   <!-- <tr>-->
  273. <div class="chromestyle" id="chromemenu">
  274. <ul>
  275. <li><a href="index.html">Home</a></li>
  276. <li><a href="#" rel="dropmenu1">Products</a></li>
  277. <li><a href="#" rel="dropmenu2">RMA Login</a></li>
  278. <li><a href="#" rel="dropmenu3">Downloads</a></li>    
  279. <li><a href="#" rel="dropmenu4">Careers</a></li>    
  280. <li><a href="#" rel="dropmenu5">Customer Support</a></li>    
  281. <li><a href="log-out" rel="dropmenu6">Log out</a></li>
  282. </ul>
  283. </div>
  284.  
  285. <!--1st drop down menu -->                                                   
  286. <div id="dropmenu1" class="dropmenudiv">
  287. <a href="#">PC Accessories</a>
  288. <a href="#">Notebook Accessories</a>
  289. <a href="#">Miscellaneous</a>
  290. </div>
  291.  
  292.  
  293. <!--2nd drop down menu                                                 
  294. <div id="dropmenu2" class="dropmenudiv" style="width: 150px;">
  295. <a href="http://www.cnn.com/">CNN</a>
  296. <a href="http://www.msnbc.com">MSNBC</a>
  297. <a href="http://news.bbc.co.uk">BBC News</a>
  298. </div> -->
  299.  
  300. <!--3rd drop down menu -->                                                   
  301. <div id="dropmenu3" class="dropmenudiv" style="width: 150px;">
  302. <a href="#">Drivers</a>
  303. <a href="#">Softwares</a>
  304. <a href="#">Miscellaneous</a>
  305. </div>
  306.  
  307. <div id="dropmenu4" class="dropmenudiv" style="width: 150px;">
  308. <a href="#">Java</a>
  309. <a href="#">Testing</a>
  310. </div>
  311.  
  312.  
  313. <script type="text/javascript">
  314. cssdropdown.startchrome("chromemenu")
  315. </script>
  316. <!-- </tr>-->
  317.                 </table></td>
  318.               </tr>
  319.               <tr></a>
  320.                 <td height="100%" valign="top"><div id="pageloader" class="style420"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  321.                   <tr>
  322.                     <td width="100%" height="100%" class="body_txt"><div align="center" class="printtext"><span class="style3">&nbsp;&nbsp;&nbsp;--
  323.                         <strong>RECIEVED FROM CUSTOMER- REPORT -- </strong></span>
  324.                     </div>
  325.                     <span><span class="style4" id="notprint">* Select a particular customer name to view the products send by them, or simply click the Get Report buttom to get a complete report...</span> </span>
  326.                       <table width="152" border="0">
  327.                         <tr>
  328.                           </tr></table><table><tr>
  329.                           <td id="butt1">Customer Name</td><td>
  330.                           <select name="customer" onChange="showReport(this.value)" id="cust">
  331.                           <option value="0">- - Select Something - -</option>
  332.                               <% 
  333.         try
  334.         {
  335.          dbmodel db=new dbmodel();
  336.         ResultSet rs=null;
  337.         PreparedStatement ps=null;
  338.         PreparedStatement ps1=null;
  339.         db.connect();
  340.         String SQL="select * from tbl_customer";
  341.         ps=db.con.prepareStatement(SQL);
  342.         rs=ps.executeQuery();
  343.           while (rs.next())
  344.         {  
  345.     %>
  346.           <option value="<%=rs.getString("customer_id")%>"><%=rs.getString("customer_name")%></option>
  347.           <%
  348.           }
  349.           out.println(rs.getString("customer_id"));
  350.           rs.close();
  351.           ps.close();
  352.           }
  353.           catch(Exception e)
  354.           {
  355.               System.out.print("Error: "+e);
  356.           }
  357.           %>
  358.                           </select> </td><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input  align="absmiddle" type="button" value="Get Report" onClick="showReport(this.value)"/></td>
  359.                         </tr>
  360.                        </table>
  361.                        <div id='txtHint' class='error_strings'></div>
  362.                        <div id='form2_errorloc' class='error_strings' style="color:#FF3300"></div> </td>
  363.                     <td width="0%" height="100%"><table width="95%" height="100%" border="0" cellpadding="0" cellspacing="0">
  364.                       <tr>
  365.                         <td height="3"><img src="images/spacer.gif" width="1" height="2"></td>
  366.                       </tr>
  367.                       <tr>
  368.                         <td height="100%" bgcolor="#D4D4D4"></td>
  369.                       </tr>
  370.                       <tr>
  371.                         <td height="1"><img src="images/spacer.gif" width="1" height="2"></td>
  372.                       </tr>
  373.                     </table></td>
  374.                   </tr>
  375.                 </table></div></td>
  376.               </tr>
  377.             </table>
  378.               <p>&nbsp;</p>
  379.           </tr>
  380.         </table></td>
  381.       </tr>
  382.       <tr>
  383.         <td><table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#3c6499" id="copyright">
  384.           <tr>
  385.             <td class="bottom-menu"><a href="#">Home</a>  |  Products |  RMA Login |  Downloads  | Careers | Customer Support | Contact Details</td>
  386.           </tr>
  387.         </table></td>
  388.       </tr>
  389.       <tr>
  390.         <td class="bottom_addr" id="copyright">&copy; 2008 TechSol India. All Rights Reserved</td>
  391.       </tr>
  392.     </table></td>
  393.     <td valign="top">&nbsp;</td>
  394.   </tr>
  395. </table>
  396. <script language="javascript">
  397. var frmvalidator  = new Validator("form2");
  398. frmvalidator.EnableOnPageErrorDisplaySingleBox();
  399. frmvalidator.EnableMsgsTogether();
  400. frmvalidator.addValidation("Vendor","req");
  401. frmvalidator.addValidation("Vendor","dontselect=0");
  402. </script>
  403. </form>
  404. </body>
  405. </html>
Help me guys......
Nov 11 '08 #1
Share this Question
Share on Google+
3 Replies


acoder
Expert Mod 15k+
P: 16,027
Your HTML is horribly invalid and you're using tables for non-tabular data. You also need a doctype and you need to validate your code.

Anyway, to only print the pageloader div, set it to display:block and everything else to display:none. The only problem is that the div is inside some nested table, so you will need to move it out before this can work properly.
Nov 11 '08 #2

P: 2
Your HTML is horribly invalid and you're using tables for non-tabular data. You also need a doctype and you need to validate your code.

Anyway, to only print the pageloader div, set it to display:block and everything else to display:none. The only problem is that the div is inside some nested table, so you will need to move it out before this can work properly.
But thats a template i took from somewhere in the net...If i move one table everything will collapse.... Anyway thanks for ur reply....
Nov 11 '08 #3

acoder
Expert Mod 15k+
P: 16,027
If it's a template that you're using, use a CSS-based template which matches the layout you're looking for. Once the div is outside the table, your problem should be easy to solve.
Nov 11 '08 #4

Post your reply

Sign in to post your reply or Sign up for a free account.