bulrush Posted May 13, 2010 Share Posted May 13, 2010 I am trying to print a page which contains a gray box with a letter or digit inside it. Some gray boxes have an inside them, but they won't print on a Ricoh C811DN or Okidata ES3640 laser printer. The boxes appear in Firefox 3.6 just fine, they just do not print. The letter in the gray box does print, however. Here's my html, where I tried various methods, and various grays to make a gray box. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Print Group/Parts Screen</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <h2>Print Group/Parts Screen, v.20b</h2> <p>Choose a group to proof, then print them out to double check the data. The following uses span and a class="graybox". <span class="graybox"><b>N</b></span> This is more text. Some gray boxes do not print on the Ricoh C811DN or Oki ES3640 printer.<br/> Test of 909090 <span style="background-color:#909090">N</span> being boxed.<br/> Test of a0a0a0 <span style="background-color:#a0a0a0">N</span> being boxed.<br/> Test of b0b0b0 <span style="background-color:#b0b0b0">N</span> being boxed.<br/> Test of d0d0d0 <span style="background-color:#d0d0d0">N</span> being boxed.<br/> </body> </html> Here's my style.css file. .graybox { color: black; font-weight: bold; background-color: #808080; } How can I get gray boxes to print? Do I have to use a different HTML tag? Quote Link to comment Share on other sites More sharing options...
bulrush Posted May 13, 2010 Author Share Posted May 13, 2010 If someone gets the gray boxes to print (they appear fine in FF and IE 6.0) would you mind reporting the printer brand and model? Thanks. Quote Link to comment Share on other sites More sharing options...
jacko310592 Posted May 14, 2010 Share Posted May 14, 2010 hi bulrush, try changing this: <link rel="stylesheet" type="text/css" href="style.css" /> to this: <link rel="stylesheet" type="text/css" href="style.css" media="screen, print" /> Quote Link to comment Share on other sites More sharing options...
bulrush Posted May 14, 2010 Author Share Posted May 14, 2010 Thanks, but this didn't work either. Is there another way this element can be constructed so it is not a background? My tech support guy said it is not printed because the element (gray box) is defined as a background, and browsers do not print backgrounds by default. Some have options to print the backgrounds, but I did not find that option in FF 3.6. This needs to print without the user adjusting browser or any other options. Thanks. Quote Link to comment Share on other sites More sharing options...
jacko310592 Posted May 14, 2010 Share Posted May 14, 2010 hmm, the only other way would be using an <img />, setting the position of it to 'absolute' (while inside a container with the position of 'relative'), then setting the z-index to make it go behind the text.... but this is in no way recommended, backgrounds should always reamin as backgrounds. after testing the media="screen, print" on my site, i too couldnt see any backgrounds on the print, so my guess is that its a browser specific problem/setting to save the user from using too much ink Quote Link to comment Share on other sites More sharing options...
bulrush Posted May 17, 2010 Author Share Posted May 17, 2010 Yes, it seems my only option is this: Make an image for a blank gray box, then 36 images for capital letters inside gray boxes, and numbers inside gray boxes. Or use ascii characters around the letter (I'm currently using vertical bars to represent the gray box: "|N|".) Quote Link to comment Share on other sites More sharing options...
haku Posted May 17, 2010 Share Posted May 17, 2010 There is a reason why background's don't print - it's to save ink, as ink can be quite expensive. Users can choose to print the background if they like when printing, but it's not really nice to your users to make them print out lots of background gray. Some food for though. Quote Link to comment Share on other sites More sharing options...
bulrush Posted May 17, 2010 Author Share Posted May 17, 2010 Yes I understand that. But these gray boxes are very small, the size of a 10 point high letter. Width about 8 points. But I will have to approach this another way. Thanks. Quote Link to comment Share on other sites More sharing options...
bulrush Posted May 20, 2010 Author Share Posted May 20, 2010 I ended up creating dynamic images with the image library of PHP. It works. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.