Web Design >> Need help with a css!
Posted by Charly on 04:12:00 06-28-2001
Hey guys,
I got a an html-document, which relies on two css-files. One for printing on the screen and the second for the output on the printer. Unfortunately they're both the same, but the result is pretty different.

Concrete problem is that if I have a look at it through my browser it looks okay and the way I want. Though when I print it, there's nothing but the arranged text on the paper; no borders (except when I redeclare them in the html-code, but then it really looks messed-up on the screen!), no backgroundcolor
or cell-background. What can I do? Can you guys have a look at the css and help me finding the bugs or improving it, please.
Can you help me out, please.

The links to the two files look like this:
<link rel=stylesheet media="screen" href="../orakel.css" type="text/css">
<!--That's for the screen-->
<link rel=stylesheet media="print" href="../print.css" type="text/css">
<!--and that was for the printer-->

Thanx Charly

I'll post the css-code and html-code right below.
Posted by Charly on 04:25:00 06-28-2001
That's the code of the two css-files, orakel.css and print.css
Can you have a look at it pls.

--------------------------------
body { background-color:#FFFFFF;}

table { background-color:#000080;padding:0;spacing:0;border-width:thin;border-color:#000000;}

th {text-align:center;background-color:#FFFFFF;color:#000000;font-family:Arial;font-size:10pt;padding:1;spacing:0;}
td {width:60px;background-color:#FFFFFF;color:#000000;font-family:Arial;font-size:10pt;padding:1;spacing:0;}
td.trenn {width:10px;background-color:#000080;color:#000000;font-family:Arial;font-size:10pt;padding:1;spacing:0;}
td.head {text-align:center;background-color:#CCCCCC;color:#000000;font-family:Arial;font-size:10pt;padding:1;spacing:0;}
td.kasus {text-align:center;background-color:#DDDDDD;color:#000000;font-family:Arial;font-size:10pt;padding:1;spacing:0;}
td.verb {text-align:center;background-color:#FFFFCC;color:#000000;font-family:Arial;font-size:10pt;padding:1;spacing:0;}

li { color:#000000;font-family:Arial;font-size:10pt;}

p { color:#000000;font-family:Arial;font-size:10pt;}
h1 { color:#FF0000;font-family:Arial;font-size:18pt;}
h2 { color:#FF0000;font-family:Arial;font-size:14pt;}
h3 { color:#FF0000;font-family:Arial;font-size:12pt;}


a:hover{color:#774400;font-size:10pt;font-family:Arial;text-decoration:none;}
a
{color:#996600;font-size:10pt;font-family:Arial;text-decoration:underline;}
a.visited
{color:#CC9933;font-size:10pt;font-family:Arial;text-decoration:underline;}
a.active
{color:#DDAA44;font-size:10pt;font-family:Arial;text-decoration:underline;}
--------------------------------
Posted by Peter on 11:51:00 07-01-2001
I promise to take a look at it when i get home... [addsig]
Posted by tart on 20:50:00 08-02-2001


i didnt pay much attention to your stylesheet, but i found some bugs right away.


:::::::::::::::::::::::::::::

a:hover{color:#774400;font-size:10pt;font-family:Arial;text-decoration:none;}
a
{color:#996600;font-size:10pt;font-family:Arial;text-decoration:underline;}
a.visited
{color:#CC9933;font-size:10pt;font-family:Arial;text-decoration:underline;}
a.active
{color:#DDAA44;font-size:10pt;font-family:Arial;text-decoration:underline;}

:::::::::::::::::::::::::::::

some of your pseudo classes are using a period instead of a colon.

(eg. "a.active" instead of "a:active")




[ This Message was edited by: tart on 2001-08-02 20:52 ]
Posted by Peter on 21:05:00 08-02-2001
Hm, periods work for me .
Posted by tart on 17:39:00 08-03-2001
but that is the difference beetween psuedo classes and regular classes. iv'e never tried just using regular classes for that task, i guess it could work.
Posted by crion on 09:32:00 02-17-2002
too much useless text for this css...
try to make more of these:

p, li, h3 {

blabla:bla; }

u get it...
Posted by Hippsipp on 02:11:00 08-22-2003
i gree with tart hjes right! [addsig]