CSS based button causes problems

mrmah
avatar
rank newbie

newbie


Posts: 5
Joined: 2008-05-01

Posted: Wed, 2008-05-14 06:10

When I do a print preview, this button shows a right graphic only. The rest is missing. It looks fine on Internet Explorer. It's very weird.

Stomme poes
Stomme poes's picture
rank Enthusiast

Enthusiast


Posts: 308
Joined: 2008-02-04
Location: Netherlands

Is it a background image?

Posted: Wed, 2008-05-14 08:25

Is it a background image? Lots of printers ignore background images to save ink.

I'm no expert, but I can fake one on teh Interwebz

mrmah
mrmah's picture
rank newbie

newbie


Posts: 5
Joined: 2008-05-01

It's a background image. I

Posted: Wed, 2008-05-14 20:25

If it's to save ink,why it shows the right graphic only.

a.pbutton {
   background: url("../images/page-button-right.gif") no-repeat top right;
    color: #ece4e4;
    display: block;
    float: left;
    font: bold 12px arial, sans-serif;
    height: 22px;
    margin-right: 10px;
    padding-right: 8px;
    text-decoration: none;
   outline: none;
}

a.pbutton span {
     background: url("../images/page-button-mid.gif") no-repeat top left;
    display: block;

    padding: 3px 0px 3px 13px;
}

a.pbutton:active {

    color: #cad9e3;

}

a.pbutton:active span {

      padding: 3px 0 3px 13px;
}
a.pbutton:hover span {
    padding: 3px 0px 3px 13px;
    color:#fff;

}

Stomme poes
Stomme poes's picture
rank Enthusiast

Enthusiast


Posts: 308
Joined: 2008-02-04
Location: Netherlands

I can't figure out why it's

Posted: Thu, 2008-05-15 07:17

I can't figure out why it's even showing the right one. All my browsers are configured to not print background colours or images, and I usually go about assuming the same for my viewers...

Looks like sliding doors, can you maybe use a print.css with a single graphic for just that page (where you know the width of the text)?

Only other thing I can think of is, what do the other browsers do on Print Preview? Apparently the browser and not the printer controls what all will be printed, and each has print-rendering quirks (like, FF still won't print the rest of a float if it's longer than 1 page).

I'm no expert, but I can fake one on teh Interwebz