
July 24th, 2005, 12:56 AM
| | | Way to have spacing between cells *only*?
I'm wondering if it's at all possible to have spacing between a table's
cells, and only between the cells, not between the outter cells and the
table's border. See end of message for an example (make sure to view this in
fixed width font).
I've played around with different things, such as margin-right, etc. but I
didn't get any results. Would this be even possible. I would have thought
the specs (either HTML or CSS) would have allowed for something like this...
Am I wrong?
Thx.
+----------------------------+
| ====== ====== ====== |
| || || || || || || |
| || || || || ^ || || | <- table border
| ====== ====== | ====== |
| <-|--------+------ cell spacing
| |
| ====== ====== ====== |
| || || || || || || <---- no extra
| || || || || || || | spacing between
| ====== ====== ====== | cell and table border
+----------------------------+ | 
July 24th, 2005, 12:56 AM
| | | Re: Way to have spacing between cells *only*?
"Sebastien B." <sebastien@nospam.nospam> wrote in message
news:xPGdnV6ENvzl9t7fRVn-rw@rogers.com...[color=blue]
> I'm wondering if it's at all possible to have spacing between a table's
> cells, and only between the cells, not between the outter cells and the
> table's border. See end of message for an example (make sure to view this[/color]
in[color=blue]
> fixed width font).
>
> I've played around with different things, such as margin-right, etc. but I
> didn't get any results. Would this be even possible. I would have thought
> the specs (either HTML or CSS) would have allowed for something like[/color]
this...[color=blue]
> Am I wrong?
>
> Thx.
>
> +----------------------------+
> | ====== ====== ====== |
> | || || || || || || |
> | || || || || ^ || || | <- table border
> | ====== ====== | ====== |
> | <-|--------+------ cell spacing
> | |
> | ====== ====== ====== |
> | || || || || || || <---- no extra
> | || || || || || || | spacing between
> | ====== ====== ====== | cell and table border
> +----------------------------+[/color]
I'm curious, why do you want to do this? See below for a possible solution.
Signed,
me
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
..cellspacerightbottom { padding-right: 10px; padding-bottom: 10px}
-->
</style>
</head>
<body bgcolor="#FFFFFF">
<table width="100%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td class="cellspacerightbottom">stuff</td>
<td>stuff</td>
</tr>
<tr>
<td>stuff</td>
<td>stuff</td>
</tr>
</table>
</body>
</html> | 
July 24th, 2005, 12:56 AM
| | | Re: Way to have spacing between cells *only*?
Sebastien B. wrote:[color=blue]
> I'm wondering if it's at all possible to have spacing between a table's
> cells, and only between the cells, not between the outter cells and the
> table's border. See end of message for an example (make sure to view this in
> fixed width font).
>
> I've played around with different things, such as margin-right, etc. but I
> didn't get any results. Would this be even possible. I would have thought
> the specs (either HTML or CSS) would have allowed for something like this...
> Am I wrong?
>
> Thx.
>
> +----------------------------+
> | ====== ====== ====== |
> | || || || || || || |
> | || || || || ^ || || | <- table border
> | ====== ====== | ====== |
> | <-|--------+------ cell spacing
> | |
> | ====== ====== ====== |
> | || || || || || || <---- no extra
> | || || || || || || | spacing between
> | ====== ====== ====== | cell and table border
> +----------------------------+
>[/color]
'cellpadding' and 'cellspacing' in HTML are replaceable in CSS with
'padding' and 'margin' respectively, if applied to table cells. See: http://www.w3.org/TR/REC-CSS2/box.html#box-dimensions
A further enhancement is 'border-spacing', where the lengths specify the
distance that separates adjacent cell borders. See: http://www.w3.org/TR/REC-CSS2/tables...border-spacing
--
Gus | 
July 24th, 2005, 12:56 AM
| | | Re: Way to have spacing between cells *only*?
"Sebastien B." <sebastien@nospam.nospam> wrote:
[color=blue]
>I'm wondering if it's at all possible to have spacing between a table's
>cells, and only between the cells, not between the outter cells and the
>table's border.[/color]
Not possible.
--
Spartanicus | 
July 24th, 2005, 12:56 AM
| | | Re: Way to have spacing between cells *only*?
in comp.infosystems. www.authoring.html, Gus Richter wrote:
[color=blue]
> 'cellpadding' and 'cellspacing' in HTML are replaceable in CSS with
> 'padding' and 'margin' respectively, if applied to table cells.[/color]
Read: http://www.w3.org/TR/REC-CSS2/tables.html
Margin for table cell has no effect, and it certainly is not cellspacing.
[color=blue]
> See: http://www.w3.org/TR/REC-CSS2/box.html#box-dimensions'[/color]
Wrong place.
[color=blue]
> A further enhancement is 'border-spacing', where the lengths specify the
> distance that separates adjacent cell borders.[/color]
This is same as cellspacing, exept it is bit more advanced.
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Utrecht, NL. | 
July 24th, 2005, 12:56 AM
| | | Re: Way to have spacing between cells *only*?
"me" <anonymous@_.com> wrote in message
news:1146u4rou5thj58@corp.supernews.com...
[color=blue]
> .cellspacerightbottom { padding-right: 10px; padding-bottom: 10px}[/color]
That only adds space within the cell, not between the cells. | 
July 24th, 2005, 12:57 AM
| | | Re: Way to have spacing between cells *only*?
"Lauri Raittila" <lauri@raittila.cjb.net> wrote in message
news:MPG.1cadfffeeea6f51f98a4aa@news.individual.ne t...[color=blue]
> in comp.infosystems. www.authoring.html, Gus Richter wrote:
>[color=green]
>> 'cellpadding' and 'cellspacing' in HTML are replaceable in CSS with
>> 'padding' and 'margin' respectively, if applied to table cells.[/color]
>
> Read: http://www.w3.org/TR/REC-CSS2/tables.html
>
> Margin for table cell has no effect, and it certainly is not cellspacing.
>[color=green]
>> See: http://www.w3.org/TR/REC-CSS2/box.html#box-dimensions'[/color]
>
> Wrong place.
>[color=green]
>> A further enhancement is 'border-spacing', where the lengths specify the
>> distance that separates adjacent cell borders.[/color]
>
> This is same as cellspacing, exept it is bit more advanced.
>[/color]
Right; and it adds space between the cells and table border too, which is
what I wanted to avoid (had already tried it) | 
July 24th, 2005, 12:57 AM
| | | Re: Way to have spacing between cells *only*?
"Spartanicus" <me@privacy.net> wrote in message
news:16f741pf7pp17e0g3vaoa54esl8f00dasu@news.spart anicus.utvinternet.ie...[color=blue]
> "Sebastien B." <sebastien@nospam.nospam> wrote:
>[color=green]
>>I'm wondering if it's at all possible to have spacing between a table's
>>cells, and only between the cells, not between the outter cells and the
>>table's border.[/color]
>
> Not possible.[/color]
That's what I figured after many failed attempts :)
Thanks. | 
July 24th, 2005, 12:57 AM
| | | Re: Way to have spacing between cells *only*?
Lauri Raittila wrote:[color=blue]
> in comp.infosystems. www.authoring.html, Gus Richter wrote:
>
>[color=green]
>>'cellpadding' and 'cellspacing' in HTML are replaceable in CSS with
>>'padding' and 'margin' respectively, if applied to table cells.[/color]
>
>
> Read: http://www.w3.org/TR/REC-CSS2/tables.html
>
> Margin for table cell has no effect, and it certainly is not cellspacing.
>
>[color=green]
>> See: http://www.w3.org/TR/REC-CSS2/box.html#box-dimensions'[/color]
>
>
> Wrong place.
>
>[color=green]
>>A further enhancement is 'border-spacing', where the lengths specify the
>>distance that separates adjacent cell borders.[/color]
>
>
> This is same as cellspacing, exept it is bit more advanced.
>[/color]
Thanks, that will teach me to simply copy some very old notes.
--
Gus | 
July 24th, 2005, 12:57 AM
| | | Re: Way to have spacing between cells *only*?
"Sebastien B." <sebastien@nospam.nospam> wrote in message
news:OvudnXXJVc-Z0NnfRVn-tw@rogers.com...[color=blue]
> "me" <anonymous@_.com> wrote in message
> news:1146u4rou5thj58@corp.supernews.com...
>[color=green]
> > .cellspacerightbottom { padding-right: 10px; padding-bottom: 10px}[/color]
>
> That only adds space within the cell, not between the cells.[/color]
True, I was unclear on your goal.
Gus suggested this: http://www.w3.org/TR/REC-CSS2/tables...border-spacing
I'm still not sure if it will fit the bill but I made a working example
anyway. I used a border for visibility but it's not required. IMO one
working example is worth a thousand words. Too bad the w3c doesn't have any.
See below:
Good Luck,
me
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
..special { border: inset 10pt } /* The top-left cell */
-->
</style>
</head>
<body bgcolor="#FFFFFF">
<table width="100%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td class="special" width="50%"> </td>
<td width="50%"> </td>
</tr>
<tr>
<td width="50%"> </td>
<td width="50%"> </td>
</tr>
</table>
</body>
</html> | 
July 24th, 2005, 12:57 AM
| | | Re: Way to have spacing between cells *only*?
"me" <anonymous@_.com> wrote in message
news:1148la8i42vdmef@corp.supernews.com...[color=blue]
> "Sebastien B." <sebastien@nospam.nospam> wrote in message
> news:OvudnXXJVc-Z0NnfRVn-tw@rogers.com...[color=green]
> > "me" <anonymous@_.com> wrote in message
> > news:1146u4rou5thj58@corp.supernews.com...
> >[color=darkred]
> > > .cellspacerightbottom { padding-right: 10px; padding-bottom: 10px}[/color]
> >
> > That only adds space within the cell, not between the cells.[/color]
>
> True, I was unclear on your goal.
>
> Gus suggested this:
> http://www.w3.org/TR/REC-CSS2/tables...border-spacing
>
> I'm still not sure if it will fit the bill but I made a working example
> anyway. I used a border for visibility but it's not required. IMO one
> working example is worth a thousand words. Too bad the w3c doesn't have[/color]
any.[color=blue]
> See below:
> Good Luck,
> me
>
> <html>
> <head>
> <title>Untitled Document</title>
> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
> <style type="text/css">
> <!--
> .special { border: inset 10pt } /* The top-left cell */
> -->
> </style>
> </head>
>
> <body bgcolor="#FFFFFF">
> <table width="100%" border="1" cellspacing="0" cellpadding="0">
> <tr>
> <td class="special" width="50%"> </td>
> <td width="50%"> </td>
> </tr>
> <tr>
> <td width="50%"> </td>
> <td width="50%"> </td>
> </tr>
> </table>
> </body>
> </html>[/color]
My mistake, that doesn't work without a border. It's probably not what you
want anyway.
Signed,
me
:-( | 
July 24th, 2005, 12:57 AM
| | | Re: Way to have spacing between cells *only*?
in comp.infosystems. www.authoring.html, Sebastien B. wrote:[color=blue]
> "Spartanicus" <me@privacy.net> wrote in message
> news:16f741pf7pp17e0g3vaoa54esl8f00dasu@news.spart anicus.utvinternet.ie...[color=green]
> > "Sebastien B." <sebastien@nospam.nospam> wrote:
> >[color=darkred]
> >>I'm wondering if it's at all possible to have spacing between a table's
> >>cells, and only between the cells, not between the outter cells and the
> >>table's border.[/color]
> >
> > Not possible.[/color][/color]
Quite right.
[color=blue]
> That's what I figured after many failed attempts :)[/color]
But there is way to style table so that it looks like that:
tbody {display:table;
border-spacing:1em;
margin:-1em -1em -1em -1em;
}
table, td, th {border:solid;}
(you don't need to have tbody element in html, but you need it if doing
proper xhml) http://www.student.oulu.fi/~laurirai...est/table.html
Works in Opera (8b3). If you want to avoid the default cellpadding
between table and tbody, use
table {disply:inline-block.}
Does not work in IE. Might work in FF. Should be somewhat widely tested
before use, as negative margins are likely to degrade badly... (but since
they should do nothing if display:table is not supported, it should work
if CSS support is not buggy.)
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Utrecht, NL. | 
July 24th, 2005, 12:57 AM
| | | Re: Way to have spacing between cells *only*?
"me" <anonymous@_.com> wrote in message
news:1148majih0eq40f@corp.supernews.com...
[color=blue][color=green]
>> .special { border: inset 10pt } /* The top-left cell */[/color][/color]
[color=blue]
> My mistake, that doesn't work without a border. It's probably not what you
> want anyway.
> Signed,
> me
> :-([/color]
Hmmm, perhaps not, but this got me thinking and I tried:
..special { border: 10pt solid transparent }
instead, which is about as close as you can get to what I wanted. This works
well in Safari (which is what I need this for), and also Firefox/Mozilla,
but brain-dead IE doesn't seem to understand what 'transparent' means (duh!
;)
I might just be able to use that.
Thx!
Seb |
Posting Rules
| You may not post new threads You may not post replies You may not post attachments You may not edit your posts HTML code is Off | | | | | | What is Bytes?
We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights.
Get the best answers to your questions from over network members.
|