Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Make CSS file more universal? 2

Status
Not open for further replies.

wallanparsons

IS-IT--Management
Jul 19, 2011
4
US
In our application the customer can print a label, and its controlled by a CSS file. A window will pop up in IE with a preview and then they can print.

The issue im having is that depending on what IE allows a customer to set their "page setup" to, i.e margins. I have to change nearly every css file to print right according to their IE settings.

Is there a way to make the CSS file more "universal" in some way?

Below is what we use.... Thanks in advance!

.printAssetLabelPANEL1
{
top: 0in;
left: -.25in;
position: absolute;
height: 1in;
width: 2in;
}
.printAssetLabelPANEL2
{
top: 0in;
left: 1.75in;
position: absolute;
height: 1in;
width: 2in;
}
.printAssetLabelPANEL3
{
top: 1in;
left: -.25in;
position: absolute;
height: 1in;
width: 2in;
}
.printAssetLabelPANEL4
{
top: 1in;
left: 1.75in;
position: absolute;
height: 1in;
width: 2in;
}
.printAssetLabelPANEL5
{
top: 2in;
left: -.3in;
position: absolute;
width: 4.2in;
}

.printAssetLabelBold
{
font-weight: bold;
font-family: Arial;
font-size: 18pt;
color: Black;
text-align: center;
padding-bottom: 1px;
vertical-align: top;
width: 2in;
}
.printAssetLabelStandard
{
font-weight: normal;
font-family: Arial;
font-size: 10pt;
color: Black;
text-align: center;
padding-bottom: 1px;
vertical-align: top;
width: 2in;
}
.printAssetLabelLargeInverted
{
font-weight: normal;
font-family: Arial;
font-size: 46pt;
color: White;
text-align: center;
background-color: Black;
padding-top: 14px;
padding-bottom: 20px;
vertical-align: baseline;
height: 1.0in;
width: 4.2in;
}
.printAssetLabelLarge
{
font-weight: normal;
font-family: Arial;
font-size: 24pt;
color: Black;
text-align: center;
padding-top: 10px;
padding-bottom: 1px;
height: 0.3in;
width: 4.2in;
}
.printAssetLabelLargeBold
{
font-weight: bold;
font-family: Arial;
font-size: 38pt;
color: Black;
text-align: center;
border: dashed 1px WHITE;
padding-bottom: 1px;
height: 0.3in;
width: 4.2in;
}
 
As a designer, there is no way to override, control, or even detect what the user has set for their printing margins.

Your CSS positioning will only work well if everyone has their browser set to print in the same manner. That might be done by spawning a help window to illustrate proper print settings.

An alternative is to generate PDF. But even PDF has some wiggle room in most PDF viewers as the user may print at actual size or with the option to 'fit to page'

 
the only control you have is off a CSS reset where you set all margins etc. to 0. this does not override a user's actual printing preferences as those are system properties.

Darryn Cooke
| Marketing and Creative Services
 
The print style sheet is the way to go.

that way parts of the page that do no need to be printed (menu's etc
) can be hidden & there is no need to send a new page just to print


A Maintenance contract is essential, not a Luxury.
Do things on the cheap & it will cost you dear
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top