...

View Full Version : Print CSS File



rajkumarpb
11-11-2008, 08:09 AM
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..


<%@ page session="true" %>
<%@ page import="java.util.*" %>
<%@ page import="java.sql.*" %>
<%@ page import="com.rajk.javacode.servlets.*" %>
<%@ page import="com.rajk.javacode.servlets.dbmodel" %>

<%
response.addHeader("Pragma", "No-cache");
response.addHeader("Cache-Control", "no-cache");
response.addDateHeader("Expires", 0);
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Techsol India - Technology Solutions | Hardware | Software</title>
<meta name="description" content="Computer hardware website">
<meta name="keywords" content="computer, hardware, software">
<link href="css/style.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="chrometheme/chromestyle.css" />
<link rel="stylesheet" type="text/css" href="chromejs/printStyle.css" media="print"/>
<style type='text/css'>
<!--
.style2 {color: #FFFFFF}
-->
body {
font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
font-size: .8em;
}

.style3 {
color: #3333CC;
font-size: 14px;
}
.style420 {
border-width: thin;
border-style: solid;
border-color: orange;
}
.style4 {color: #FF0000}
#menu1 { display : none }

a:link {color:black; text-decoration:none}
a:hover {color:blue; text-decoration:italics}
@media print
{
#cust
{
display:none;
}
#butt
{
display:none;
}
#input1
{
display:none;
}
#chromemenu
{
display:none;
}
#textprint
{
width:100%;
}
#copyright
{
display:none;
}
}

</style>

<script language="javascript">
var yourtext = "** WELCOME TO TECHSOL INDIA! **";
var wedge1=" ";
var wedge2=" ";
var message1=wedge1+yourtext+wedge2;
var dir = "lside";
var speed = 85;

function bouncey() {

if (dir == "lside") {
message2=message1.substring(2,message1.length)+" ";
window.status=message2;
setTimeout("bouncey();",speed);
message1=message2;

if (message1.substring(0,1) == "*") {
dir="rside";
}
}

else {
message2=" "+message1.substring(0,message1.length-2);
window.status=message2;
setTimeout("bouncey();",speed);
message1=message2;
if (message1.substring(message1.length-1,message1.length) == "*") {
dir="lside";
}
}
}
bouncey();
</script>
<script type="text/javascript">

//New code from w3schools website
var xmlHttp

function showReport(str)
{
xmlHttp = GetXmlHttpObject();
if (xmlHttp==null)
{
alert("Your browser does not support AJAX!");
return;
}
var url="getreport2.jsp?q=";
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url+escape(str),true);
xmlHttp.send(null);
}

function stateChanged()
{
if (xmlHttp.readyState==4 && xmlHttp.status==200)
{
var results = xmlHttp.responseText;
if(results!=0)
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
}
else
{
document.getElementById("txtHint").innerHTML="No records in the database";
}
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}


</script>

<script language="javascript">
function search()
{
if(document.form2.input1.value!="")
{
window.open("http://www.google.co.in/search?q="+document.form2.input1.value);
}
else
{
alert("Please enter something to search!!!");
}
}
function clearthis()
{
document.form2.customer.value="0";
}
//Right-click disabling
</script>
<script language="javascript" src="chromejs/datepicker.js">
</script>
<script language="javascript" src="chromejs/chrome.js">
</script>
<script language="javascript" src="chromejs/validation.js">
</script>
<!-- OnContextmenu denotes the right click menu
<body oncontextmenu="return false;"> -->
<%
String s=(String)session.getAttribute("un");
if(s==null)
{
response.sendRedirect("rmalogin.jsp");
}
%>
<body onLoad="clearthis()">


<form name="form2" method="post" action="">
<input type="hidden" name="hide_sess" value="<%=session.getId()%>">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top">&nbsp;</td>
<td width="750" height="100%" valign="top"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="1" valign="top"><div style="position:absolute; top:25px; margin-left:590px; width:160px">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="search style2" id="input1">Search Google.co.in</td>
<td>&nbsp;</td>
</tr>
<tr>
<td width="130"><input name="input1" type="text" class="login-form" value="" id="input1"></td>
<td>
<a href="javascript:search();"><img src="images/btn-ok2.gif" border="0" width="20" height="20"/></a>
</td>
</tr>
</table>

</div>
<img src="images/logo_new copy.jpg" width="750" height="175"></td>
</tr>
<tr>
<td height="100%"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="187" height="100%"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="s-menu-head" id="input1">PRODUCT Category</td>
</tr>
<tr>
<td><img src="images/spacer.gif" width="187" height="2"></td>
</tr>
<tr>
<td id="menubar" height="100%"><table width="100%" height="100%" cellpadding="0" cellspacing="0" style="border:solid; border-width:1px; color:#CCCCCC" id="input1">

<tr>
<td height="1"><img src="images/spacer.gif" width="1" height="5"></td>
</tr>
<tr>
<td height="1" class="sub"><a href="entryforms.jsp" class="sub_lnk">RMA Entry Form </a></td>
</tr>
<tr>
<td height="1" class="sub"><a href="processdesc.jsp" class="sub_lnk">RMA Execution </a></td>
</tr>
<tr>
<td height="1" class="sub"><a href="rmaout.jsp" class="sub_lnk">RMA Out </a></td>
</tr>
<tr>
<td height="1" class="sub"><a href="instantreplaceditems.jsp" class="sub_lnk">Instant Replaced Items </a></td>
</tr>
<tr>
<td height="1" class="sub">

<SPAN onMouseOver="document.all.menu1.style.display = 'block'" onMouseOut="document.all.menu1.style.display = 'block'">
Reports</SPAN><BR/>
<SPAN ID="menu1" onClick="document.all.menu1.style.display = 'none'"><br/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="recfromcust.jsp" class="sub_lnk">Recieved from Customer</A><BR/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="wait2send2vendor.jsp" class="sub_lnk">Waiting to Send to Vendor</A><BR/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="sendtovendor.jsp" class="sub_lnk">Send to Vendor</A><BR/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="wait2give2cust.jsp" class="sub_lnk">Recieved from Vendor</A><BR/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="given2customer.jsp" class="sub_lnk">Given to Customer</A><br/>
</SPAN>
</td>
</tr>
<!-- <tr>
<td height="1" class="sub"><a href="wait2send2vendor.jsp" class="sub_lnk">Waiting to send to Vendor </a></td>
</tr>
<tr>
<td height="1" class="sub"><a href="sendtovendor.jsp" class="sub_lnk">Send to Vendor List </a></td>
</tr>
<tr>
<td height="1" class="sub"><a href="wait2give2cust.jsp" class="sub_lnk">Recieved from Vendor</a></td>
</tr>
<tr>
<td height="1" class="sub"><a href="given2customer.jsp" class="sub_lnk">Given to Customer </a></td>
</tr>-->
<tr>
<td height="1" class="sub"><a href="snostatus.jsp" class="sub_lnk">Serial No Status </a></td>
</tr>
<tr>
<td height="1" class="sub"><a href="useradmin.jsp" class="sub_lnk">User Administration </a></td>
</tr>

<tr>
<td>&nbsp;</td>
</tr>
</table></td>
</tr>
<tr>
<td><img src="images/spacer.gif" width="187" height="2"></td>
</tr>
</table></td>
<td width="1"><img src="images/spacer.gif" width="8" height="8"></td>
<td valign="top"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" id="textprint">
<tr>
<td height="1"><table width="100%" border="0" cellspacing="0" cellpadding="0" hspace="0">
<!-- <tr>-->
<div class="chromestyle" id="chromemenu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="#" rel="dropmenu1">Products</a></li>
<li><a href="#" rel="dropmenu2">RMA Login</a></li>
<li><a href="#" rel="dropmenu3">Downloads</a></li>
<li><a href="#" rel="dropmenu4">Careers</a></li>
<li><a href="#" rel="dropmenu5">Customer Support</a></li>
<li><a href="log-out" rel="dropmenu6">Log out</a></li>
</ul>
</div>

<!--1st drop down menu -->
<div id="dropmenu1" class="dropmenudiv">
<a href="#">PC Accessories</a>
<a href="#">Notebook Accessories</a>
<a href="#">Miscellaneous</a>
</div>


<!--2nd drop down menu
<div id="dropmenu2" class="dropmenudiv" style="width: 150px;">
<a href="http://www.cnn.com/">CNN</a>
<a href="http://www.msnbc.com">MSNBC</a>
<a href="http://news.bbc.co.uk">BBC News</a>
</div> -->

<!--3rd drop down menu -->
<div id="dropmenu3" class="dropmenudiv" style="width: 150px;">
<a href="#">Drivers</a>
<a href="#">Softwares</a>
<a href="#">Miscellaneous</a>
</div>

<div id="dropmenu4" class="dropmenudiv" style="width: 150px;">
<a href="#">Java</a>
<a href="#">Testing</a>
</div>


<script type="text/javascript">
cssdropdown.startchrome("chromemenu")
</script>
<!-- </tr>-->
</table></td>
</tr>
<tr></a>
<td height="100%" valign="top"><div id="pageloader" class="style420"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" height="100%" class="body_txt"><div align="center" class="printtext"><span class="style3">&nbsp;&nbsp;&nbsp;--
<strong>RECIEVED FROM CUSTOMER- REPORT -- </strong></span>
</div>
<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>
<table width="152" border="0">
<tr>
</tr></table><table><tr>
<td id="input1">Customer Name</td><td>
<select name="customer" onChange="showReport(this.value)" id="cust">
<option value="0">- - Select Something - -</option>
<%
try
{
dbmodel db=new dbmodel();
ResultSet rs=null;
PreparedStatement ps=null;
PreparedStatement ps1=null;
db.connect();
String SQL="select * from tbl_customer";
ps=db.con.prepareStatement(SQL);
rs=ps.executeQuery();
while (rs.next())
{
%>
<option value="<%=rs.getString("customer_id")%>"><%=rs.getString("customer_name")%></option>
<%
}
out.println(rs.getString("customer_id"));
rs.close();
ps.close();
}
catch(Exception e)
{
System.out.print("Error: "+e);
}
%>
</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)" id="butt"/></td>
</tr>
</table>
<div id='txtHint' class='error_strings'></div>
<div id='form2_errorloc' class='error_strings' style="color:#FF3300"></div> </td>
<td width="0%" height="100%"><table width="95%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="3"><img src="images/spacer.gif" width="1" height="2"></td>
</tr>
<tr>
<td height="100%" bgcolor="#D4D4D4"></td>
</tr>
<tr>
<td height="1"><img src="images/spacer.gif" width="1" height="2"></td>
</tr>
</table></td>
</tr>
</table></div></td>
</tr>
</table>
<p>&nbsp;</p>
</tr>
</table></td>
</tr>
<tr>
<td><table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#3c6499" id="copyright">
<tr>
<td class="bottom-menu"><a href="#">Home</a> | Products | RMA Login | Downloads | Careers | Customer Support | Contact Details</td>
</tr>
</table></td>
</tr>
<tr>
<td class="bottom_addr" >&copy; 2008 TechSol India. All Rights Reserved</td>
</tr>
</table></td>
<td valign="top">&nbsp;</td>
</tr>
</table>
<script language="javascript">
var frmvalidator = new Validator("form2");
frmvalidator.EnableOnPageErrorDisplaySingleBox();
frmvalidator.EnableMsgsTogether();
frmvalidator.addValidation("Vendor","req");
frmvalidator.addValidation("Vendor","dontselect=0");
</script>
</form>
</body>
</html>

Please help me guys....:(

silverchild
11-12-2008, 02:28 AM
Hi.

You need to wrap your styles specific to printing with "@Media print{ }". I have a sample below which I took from http://www.w3schools.com/css/css_mediatypes.asp. Hope this helps.

<style>
@media screen
{
p.test {font-family:verdana,sans-serif; font-size:14px}
}

@media print
{
p.test {font-family:times,serif; font-size:10px}
}

@media screen,print
{
p.test {font-weight:bold}
}
</style>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum