A simple question regading table borders

I am trying to create some styles for table with solid 1px black border around the table (the normal table border) and the
I should look like a grid.

I want to make it possible with the least number of possible styles.
<table class="grid">
<tr class="light">
<td>tr1 td1</td>
<td>tr1 td2</td>
</tr>
<tr class="dark">
<td>tr2 td1</td>
<td>tr2 td2</td>
</tr>
</table>

"light" and "dark" are classes used to color the rows accordingly.

Don't laught at me but I have spent days to find a good solution for this. I have separate classes for the leftmost td and something like this :(

please help this poor java programmer with no knowledge of cssdo you have any css written that you can post?

to give your border to class grid, just do something like

.grid { border=1px solid black; }

do you want borders around the table itself, the rows, or the cells?Is this what you're looking for?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang='en'>
<head>
<META HTTP-EQUIV='Content-Type' CONTENT='text/html; charset=ISO-8859-1'>
<title>Page title</title>
<style type="text/css">
<!--
body {
margin: 0;
padding: 1em;
font: medium arial, helvetica, sans-serif;
background-color: white;
color: black;
}
.grid {
border-collapse: collapse;
border: solid 1px black;
}
.grid td {
border: solid 1px black;
padding: 2px 5px
}
.light {
background-color: #eee;
}
.dark {
background-color: #ccc;
}
-->
</style>
</head>
<body>

<table class="grid">
<tr class="light">
<td>tr1 td1</td>
<td>tr1 td2</td>
</tr>
<tr class="dark">
<td>tr2 td1</td>
<td>tr2 td2</td>
</tr>
</table>

</body>
</html>Thanks a lot Charles!:)
This is exactly the thing I was looking for. You won't believe but I spent days for it.
I Download ed hell lot of CSS editors but it didn't help.

btw, the font size is still bigger in firefox. IE renders it properly.
 
Back
Top