A little help with CSS please

[ideasworking]

Hello,

With the help of some people here I have managed to use CSS to format some tables such that some tables don't print and other tables print with borders that are collapsed. Now as I look at the code it appears that there are some mistakes. Would someone please review the code and help me clean it up if there are problems.

Thanks,
Lou

<style type="text/css" media="print">
.noprint { display: none; }
.borderprint th,
.borderprint td {
  border: 1px solid black;
  border-collapse:collapse;
} 
table {
	border-collapse: collapse;
	border: #000000;
}
</style>		
<style type="text/css" media="screen">
<!--
.TableText {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
}
.TableHeaderText {	font-family: Arial, Helvetica, sans-serif; font-weight: bold;
	font-size: 11px;
}
.SectionText {	font-family: Arial, Helvetica, sans-serif; font-weight: bold;
	font-size: 14px;
}
-->
</style>

<table width='650' border='0' align='center' cellpadding='1' bgcolor="#000000" class="borderprint td">

 

[trollacious]

Microsoft has a developer's toolbar that will validate your HTML and CSS through W3C.org. I've found it quite useful.

http://www.microsoft.com/downloads/...64-672d-4511-bb3e-2d5e1db91038&displaylang=en

Lee

 

[ideasworking]

Thanks Lee,

I agree this is a very helpful tool. It has helped me identify some other problems in my code. Unfortunately it appears to be limited to syntax checking. In my CSS I have border-collapse:collapse; twice which seems weird too me. Maybe it's ok... but I don't think it's correct. If anyone else can verify if my code is ok or requires changes I would like to hear your thoughts.

Cheers!
Lou

 

[Vragabond]

#1. In your html, you are applying two classes to your table, "borderprint" and "td". It seems like the class "td" is never used anywhere and as such completely unnecessary.

#2. In your CSS, you are applying [tt]border-collapse: collapse;[/tt] to a td element (in .borderprint td). <td> element does not accept this value and it will be simply ignored.

#3. Your shorthand border declaration on the table is missing width and style attributes. Either specify those or simply use border-color.

#4. All your classes defined for the screen seems like they are unused.

#5. It seems that .noprint class is unused.

#6. Width, border, alignment, cellpadding and background color of the table would better be defined in css rather than html.