These are the 8 Warnings from W3C-CSS Validator:
14 a:hover You have no background-color set (or background-color is set to transparent) but you have set a color. Make sure that cascading of colors keeps the text reasonably legible.
19 Same colors for color and background-color in two contexts td.c3 and h1
19 Same colors for color and background-color in two contexts body and h1
19 h1 You have no background-color set (or background-color is set to transparent) but you have set a color. Make sure that cascading of colors keeps the text reasonably legible.
27 body You have no color set (or color is set to transparent) but you have set a background-color. Make sure that cascading of colors keeps the text reasonably legible.
28 body Redefinition of padding-top
41 td.c3 You have no color set (or color is set to transparent) but you have set a background-color. Make sure that cascading of colors keeps the text reasonably legible.
60 table.c7 You have no color set (or color is set to transparent) but you have set a background-color. Make sure that cascading of colors keeps the text reasonably legible.
This is my CSS code:
<style type="text/css">
/*<![CDATA[*/
a:link {color: rgb(153,0,51);text-decoration: none;}
a:visited {color: rgb(153,0,51);text-decoration: none;}
a:active {color: rgb(153,0,51);text-decoration: none;}
a:hover {color: #000000;text-decoration: underline;}
h1 {margin: 0;color: rgb(153, 0, 51);font-style: normal;font-family: "Trebuchet MS", sans-serif, Arial;
font-size: 2em;}
body {margin:0;padding:0;background:rgb(153, 0, 1);padding-top:30px;padding-bottom:30px;font-style: normal;font-family:Tahoma, sans-serif, Arial;
font-size:1em;}
div.c1 {text-align: right;}
div.c2 {text-align: center;}
td.c3 {background: rgb(153, 0, 51);}
td.c4 {border-style: solid;border-width: 1px;
border-color: rgb(237, 216, 224);}
table.c5 {border-style: solid;border-width: 1px;
border-color: rgb(153, 0, 51);}
div.c6 {text-align: center;border-style: solid;
border-width: 0;border-color: rgb(237, 216, 224);}
table.c7 {background-color: rgb(237, 216, 224);}
/*]]>*/
</style>
These are the details of my Web page:
Web page background is red, all tables are pink, H1 (heading) is red, text is black, links are red except hover link is black and underlined. Table c7 is pink with no border and contains all other tables. Table c5 is pink with red border. Table c5 contains c3 (1st column with no border) which contains c2 (7 rows/navigation buttons/black text/red background). Table c5 contains c4 (2nd column with no border) which contains spacer image. Table c5 contains c4 (3rd column with no border)which contains heading red, text black, and image(s). Table c5 contains div 6 (3 rows with no borders).Div c1 contains image(s). Div c2 contains an image of a red line with no borders.
How do I resolve all the W3Cwarnings and specifically these two: (Line 19 states: Same colors for color and background-color in two contexts td.c3 and h1) (Line 19 states: Same colors for color and background-color in two contexts body and h1.)
I can't change h1 color as it must be red. I can't change body background color as it's the background color of the entire Web page and must be red. I can't change background color of td-c3 as the navigation buttons must be black text on red background. In addition, I would like the option to pick and choose which images have a border (usually those in div c1 and in c4 of table c5) but I would like the option for certain images not to have a border.
If it's best for me to post my HTML code (already validated), please advise. Thank you so much. I have been trying to resolve this for days.