PDA

View Full Version : Giving My Table A Border With Space



tomyknoker
Mar 30th, 2007, 08:10 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?

ronaldb66
Mar 30th, 2007, 08:53 AM
I of course don't know what the rest of your table looks like since you haven't supplied any additional information, but you can easily set a border to the table itself with CSS.
I tried setting some padding to separate the border but at least in IE this failed; it could be that IE isn't playing nice as usual, or that I don't understand the--rather complicated--CSS table model correctly.

A somewhat ugly but effective solution would be to wrap the table in a container element and set a border and some padding on that.

tomyknoker
Mar 30th, 2007, 08: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?

ronaldb66
Mar 30th, 2007, 09:23 AM
Yes, as far as I know you can specify a background image to both tr ans td elements using the CSS background-image property.

Arbitrator
Mar 30th, 2007, 12:37 PM
I tried setting some padding to separate the border but at least in IE this failed; it could be that IE isn't playing nice as usual, or that I don't understand the--rather complicated--CSS table model correctly.Internet Explorer doesn’t support padding on table elements. Your “ugly but effective solution” is the method that would be required to attain this effect in that browser.

So far as I know, the table box model is the same as the normal box model aside from border spacing and that it uses a border box instead of a content box.