CSS Print Style Sheet Problem

bennyboy7 · #1 (**permalink**) Aug 10th, 2007, 16:05

Hi Guys

Ive just been trying to set the print margins:

Print.css

 body { 
background: white; 
font:Normal 12px Georgia, "Times New Roman", Times, serif; 
} 
#l-col { 
display: none; 
} 

#wrap, #hdr, #bar, #carbg, #main, #ftr { 
width: auto; 
padding: 0; 
border: 0; 
float: none !important; 
color: black; 
background: transparent none; 

} 
div#wrap, #hdr, #bar, #carbg, #main, #ftr { 
margin-left: 0cm; margin-right: 0cm ; 
padding-top: 0; 
border-top: 0px solid #930; 
} 


div #hdr, #bar, #carbg img { 
vertical-align: bottom; 
}

for some reason the images get cut off on the right handside? If I manually change the print margins to 0, in the print page setup it works on PC?

It works on a mac fine?

Is there a way to scale images to fit using css? The Width of the images are 760px

Code:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> 
<title>Example CMS</title> 
<meta name="keywords" content=""> 
<meta name="Description" content=""> 


<style type="text/css" media="all"> @import "main.css";</style> 

<link rel="stylesheet" type="text/css" media="print" href="print.css" /> 

</head> 
<body> 
<div id="wrap"> 
<div id="hdr" align="center"> 
            <img src="img/header.jpg" alt="" height="105" width="760" border="0" /></div>
         <div id="bar"> 
            </div> 
         <div id="carbg"> 
            <img src="img/mainstrip.jpg" alt="" height="175" width="760" border="0" /></div> 
         <div id="bodyblock"> 
            <div id="l-col" align="left"> 
               <ul class="avmenu"> 
                  <li><a href="db_login.php">Login</a></li> 
                  <li><a class="current" href="index.html">Home</a></li> 
                  <li><a href="allusers.php">All Users</a></li> 
                  <li><a href="register.html">Register</a></li> 
                  <li><a href="contact.html">Contact us</a></li> 
               </ul> 
            </div> 
            <div id="main" align="left"> 
               <div class="mainindent"> 
                  <div class="blue"> 
                     <h2><span class="headlinetext"><span class="blue">Welcome</span></h2> 
                  </div> 
                  <p> 
                     Example CMS</p> 
               </div> 
            </div> 
         </div> 
         <div id="ftr" align="center"> 
            <span class="small">Copyright &copy; 2007</span></div> 
      </div> 
</body> 
</html>

Any help would be great!

Kropotkin · #2 (**permalink**) Aug 14th, 2007, 08:58

Hi

Could I see a url of this?

Just off the top of my head though i don't see why you couldn't set a class on your images for print

Code: Select all

 
@media print
{
img {width:90%;height:90%}
}

not tested

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Adding a style sheet to an RSS feed problem	Andrew1986	Other Programming Languages	5	Feb 19th, 2008 10:31
Why Style sheet isnt working	kaz	Web Page Design	19	Dec 21st, 2007 01:10
new to css: what's the best way to insert image using the external style sheet?	mad samuel	Web Page Design	14	Aug 10th, 2007 17:52
How to tell IE7 to use a pariticular style in a single style sheet	figo2476	Web Page Design	5	May 25th, 2007 14:23
Linking to an external style sheet	ahm531	Web Page Design	6	Aug 31st, 2006 13:23

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
CSS Print Style Sheet Problem