|
Posted by Sebastien B. on March 24, 2005, 9:37 pm
Please log in for more thread options
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
+----------------------------+
|
|
Posted by me on March 24, 2005, 9:33 pm
Please log in for more thread options
> 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
> +----------------------------+
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>
|
|
Posted by Sebastien B. on March 25, 2005, 1:40 pm
Please log in for more thread options
> .cellspacerightbottom { padding-right: 10px; padding-bottom: 10px}
That only adds space within the cell, not between the cells.
|
|
Posted by me on March 25, 2005, 1:14 pm
Please log in for more thread options
>
> > .cellspacerightbottom { padding-right: 10px; padding-bottom: 10px}
>
> That only adds space within the cell, not between the cells.
True, I was unclear on your goal.
Gus suggested this:
http://www.w3.org/TR/REC-CSS2/tables.html#propdef-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>
|
|
Posted by me on March 25, 2005, 1:31 pm
Please log in for more thread options
> >
> > > .cellspacerightbottom { padding-right: 10px; padding-bottom: 10px}
> >
> > That only adds space within the cell, not between the cells.
>
> True, I was unclear on your goal.
>
> Gus suggested this:
> http://www.w3.org/TR/REC-CSS2/tables.html#propdef-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>
My mistake, that doesn't work without a border. It's probably not what you
want anyway.
Signed,
me
:-(
|
| Similar Threads | Posted | | img table cells next to each other without a gap possible? | May 26, 2006, 10:27 pm |
| fixed table cells | January 23, 2007, 11:40 pm |
| Table cells change size | March 1, 2005, 9:02 pm |
| Table with 100% width but relative cells? | June 1, 2005, 11:08 am |
| DIVs inside table cells? | April 13, 2008, 9:46 am |
| Freezing the width of TABLE cells | June 20, 2008, 1:12 pm |
| Newbie: Problems with table cells & colspan | August 9, 2004, 7:11 pm |
| There is no gap between cells in html table with CELLSPACING greater than zero | August 25, 2004, 11:38 am |
| Optimized table with fixed size cells? | February 4, 2007, 5:17 pm |
| how to properly hide/show table cells? | January 31, 2008, 5:38 pm |
|
XML Sitemap