how to print background image?

Question

when i click print option background image is not printing..could u please help me out.
here is my css

.OldNote {  
    background-image: url(/images/icons/arkiv.gif);
    background-repeat: repeat;
    width: 100%;
    height: 100%;
    margin: 0px;
}

possible duplicate of [How can I print background images in FF or IE?](http://stackoverflow.com/questions/596876/how-can-i-print-background-images-in-ff-or-ie) — JJJ, Jul 25 '12 at 09:39

score 3 · Answer 1 · answered Jul 25 '12 at 09:39

3

Usually it is up to the user and their browser settings to print or not print background images. Check your browser settings.

If you don't want to rely on that, don't place the image in the background, place it on your page in an <img>-tag.

answered Jul 25 '12 at 09:39

Bjoern

15,934
4
43
48

Hi Bjoern,,i tried using browser setting but no luck..if i place tag in my page how can i give css to that img to repeat image in background? – kiran Jul 25 '12 at 10:03
Foreground images cannot be repeated via css, only background images can. – Bjoern Jul 25 '12 at 10:37
anyway thanks for ur answer..i solved it by changing the media="screen" to media="all". – kiran Jul 25 '12 at 14:16

score 0 · Answer 2 · answered Oct 29 '12 at 06:57

You can just add an image tag like this, whereever you want the image to be displayed :

 <img src="url" class='printableonly' />

Then in the css, you can do like this :

  @media screen {
      .printableonly{
           display: none;
       }
  }

  @media print{
     .printableonly {

          display: inline;

       }
   }

score 0 · Answer 3 · answered Oct 29 '12 at 07:07

i just add, if you want it to be background, there is no know way to make it repeat like a common backgrond. To put it under the content you may use css as adding it in other element before the content and giving both elements css position: absolute style, together with the *z-index: .. *, where z-index of content will be bigger.

Maybe you may look into full size background solution which is made very similar

how to print background image?

3 Answers3