Im having a little trouble getting this to work, its my first attempt at using one set of
css instructions to control multiple tables rather than use dreamweaver to assign properties to 1 table at a time.
- Code: Select all
table.ess {
border-width: 0px 0px 0px 0px;
border-spacing: 0px;
border-style: solid solid solid solid;
border-color: #000066 #000066 #000066 #000066;
border-collapse: collapse;
background-color: ;
}
table.ess th {
border-width: 2px 2px 2px 2px;
padding: 2px 2px 2px 2px;
border-style: solid solid solid;
border-color: #000066 #000066 #000066 #00006;
background-color: #000066;
-moz-border-radius: 0px 0px 0px 0px;
}
table.ess td {
border-width: 2px 2px 2px 2px;
padding: 2px 2px 2px 2px;
border-style: solid solid solid;
border-color: #000066 #000066 #000066 #00006;
background-color: #c1e7ff;
-moz-border-radius: 0px 0px 0px 0px;
}
My problem is that in Firefox all my table borders (TH and TD) appear as grey but in IE they appear as the colour intended. I know browsers vary but is there a way to get my desired color in FF?
I read in here that becasue browsers display things differently I might need to make one
css file for FF and one for IE and use this
- Code: Select all
<!--[if lte IE 6]> <link rel="StyleSheet" type="text/css" href="ieonly.css" /> <![endif]-->
to call the
css file depending upon the browser viewing the page. Is this the case?
Thanks peeps!!!!!!!
EDIT//// SOLVED IT...
I removed all entries of more than one instance.. for example,
- Code: Select all
border-width: 2px 2px 2px 2px;
changed to
- Code: Select all
border-width: 2px;
I did that for all repeated instructions and its fine now....