Log in

View Full Version : Giving My Table A Border With Space



tomyknoker
03-30-2007, 07:11 AM
Hi All,

I am trying to make my table do the attached, where it has a border around the entire table but has a 2px space edge... Like the attched image, any ideas?

tomyknoker
03-30-2007, 07:53 AM
Can you also add an image to a <tr> or <td> I want the cells to have diagonal lines and the only way I see that happening is adding a bg image... Anyone know about this?

codeexploiter
03-30-2007, 09:08 AM
Try the following code



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
.outer
{
border:2px solid blue;
}
</style>
</head>

<body>
<table width="960" cellpadding="0" cellspacing="20" class="outer">
<tr>
<td width="100&#37;" valign="middle" align="center">

<table border="1" width="940" cellpadding="0" cellspacing="0">
<tr>
<td width="100">Hello</td>
<td width="200">Hello world</td>
<td width="300">Welcome</td>
<td width="340">Testing</td>
</tr>

<tr>
<td width="100">Hello</td>
<td width="200">Hello world</td>
<td width="300">Welcome</td>
<td width="340">Testing</td>
</tr>

</table>
</td>
</tr>
</table>
</body>
</html>

tomyknoker
03-30-2007, 09:12 AM
That worked a treat thanks! Do you happen to know how I could make the top row and the last row of table bigger than the middle rows? I know I could just do this with px but am trying to start using em's...

codeexploiter
03-30-2007, 10:12 AM
You can even specify the height of the first and last row of the table in such a way that it fits your requirements.

tomyknoker
03-30-2007, 12:58 PM
But can I do it using ems? Or do I need to give it a px value?