473,385 Members | 1,309 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,385 software developers and data experts.

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
+----------------------------+

Jul 23 '05 #1
12 2186
me
"Sebastien B." <se*******@nospam.nospam> wrote in message
news:xP********************@rogers.com...
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>
Jul 23 '05 #2
Sebastien B. wrote:
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
+----------------------------+


'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
Jul 23 '05 #3
"Sebastien B." <se*******@nospam.nospam> wrote:
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.


Not possible.

--
Spartanicus
Jul 23 '05 #4
in comp.infosystems.www.authoring.html, Gus Richter wrote:
'cellpadding' and 'cellspacing' in HTML are replaceable in CSS with
'padding' and 'margin' respectively, if applied to table cells.
Read: http://www.w3.org/TR/REC-CSS2/tables.html

Margin for table cell has no effect, and it certainly is not cellspacing.
See: http://www.w3.org/TR/REC-CSS2/box.html#box-dimensions'
Wrong place.
A further enhancement is 'border-spacing', where the lengths specify the
distance that separates adjacent cell borders.


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.
Jul 23 '05 #5
"me" <anonymous@_.com> wrote in message
news:11*************@corp.supernews.com...
.cellspacerightbottom { padding-right: 10px; padding-bottom: 10px}


That only adds space within the cell, not between the cells.
Jul 23 '05 #6
"Lauri Raittila" <la***@raittila.cjb.net> wrote in message
news:MP************************@news.individual.ne t...
in comp.infosystems.www.authoring.html, Gus Richter wrote:
'cellpadding' and 'cellspacing' in HTML are replaceable in CSS with
'padding' and 'margin' respectively, if applied to table cells.


Read: http://www.w3.org/TR/REC-CSS2/tables.html

Margin for table cell has no effect, and it certainly is not cellspacing.
See: http://www.w3.org/TR/REC-CSS2/box.html#box-dimensions'


Wrong place.
A further enhancement is 'border-spacing', where the lengths specify the
distance that separates adjacent cell borders.


This is same as cellspacing, exept it is bit more advanced.


Right; and it adds space between the cells and table border too, which is
what I wanted to avoid (had already tried it)
Jul 23 '05 #7
"Spartanicus" <me@privacy.net> wrote in message
news:16********************************@news.spart anicus.utvinternet.ie...
"Sebastien B." <se*******@nospam.nospam> wrote:
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.


Not possible.


That's what I figured after many failed attempts :)

Thanks.
Jul 23 '05 #8
Lauri Raittila wrote:
in comp.infosystems.www.authoring.html, Gus Richter wrote:

'cellpadding' and 'cellspacing' in HTML are replaceable in CSS with
'padding' and 'margin' respectively, if applied to table cells.

Read: http://www.w3.org/TR/REC-CSS2/tables.html

Margin for table cell has no effect, and it certainly is not cellspacing.

See: http://www.w3.org/TR/REC-CSS2/box.html#box-dimensions'

Wrong place.

A further enhancement is 'border-spacing', where the lengths specify the
distance that separates adjacent cell borders.

This is same as cellspacing, exept it is bit more advanced.


Thanks, that will teach me to simply copy some very old notes.

--
Gus
Jul 23 '05 #9
me
"Sebastien B." <se*******@nospam.nospam> wrote in message
news:Ov********************@rogers.com...
"me" <anonymous@_.com> wrote in message
news:11*************@corp.supernews.com...
.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...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%">&nbsp;</td>
<td width="50%">&nbsp;</td>
</tr>
<tr>
<td width="50%">&nbsp;</td>
<td width="50%">&nbsp;</td>
</tr>
</table>
</body>
</html>
Jul 23 '05 #10
me
"me" <anonymous@_.com> wrote in message
news:11*************@corp.supernews.com...
"Sebastien B." <se*******@nospam.nospam> wrote in message
news:Ov********************@rogers.com...
"me" <anonymous@_.com> wrote in message
news:11*************@corp.supernews.com...
.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...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%">&nbsp;</td>
<td width="50%">&nbsp;</td>
</tr>
<tr>
<td width="50%">&nbsp;</td>
<td width="50%">&nbsp;</td>
</tr>
</table>
</body>
</html>


My mistake, that doesn't work without a border. It's probably not what you
want anyway.
Signed,
me
:-(
Jul 23 '05 #11
in comp.infosystems.www.authoring.html, Sebastien B. wrote:
"Spartanicus" <me@privacy.net> wrote in message
news:16********************************@news.spart anicus.utvinternet.ie...
"Sebastien B." <se*******@nospam.nospam> wrote:
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.
Not possible.


Quite right.
That's what I figured after many failed attempts :)


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.
Jul 23 '05 #12

"me" <anonymous@_.com> wrote in message
news:11*************@corp.supernews.com...
.special { border: inset 10pt } /* The top-left cell */
My mistake, that doesn't work without a border. It's probably not what you
want anyway.
Signed,
me
:-(


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
Jul 23 '05 #13

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

12
by: Rick DeBay | last post by:
I'm trying to create a layout table, where the spacing between rows varies. I've tried using setting margin-top and border-top for the rows I wan't spaced down from the one above, and I've also...
13
by: Dave | last post by:
Hi, what Property and Values are used to space out further from one another the items in a list (assuming it's possible)? The default presentation is a bit "bunched up" for me. Thanks, Dave
2
by: John | last post by:
Now and again I like to start a sentence with a large capital, maybe in a different font. This upsets the line spacing and I've failed to find any css that will effectively crop the capital letter...
4
by: Bernd Goldschmidt | last post by:
Hi. I've got a somewhat wired problems with an extra space between table rows in Mozilla and Opera (IE works fine). With the code below, cells within a row align seamlessly, but there is a...
4
by: fleemo17 | last post by:
Is there a way to tweak the spacing of lines of text (or leading) *specifically* in IE6? I've created a "Quick Search" box in my layout which renders pretty consistently in all the browsers I've...
16
by: Barbara de Zoete | last post by:
Here's what I'm trying to do: Create a table with generic style property . Have a few table cells in the thead that 'have to' melt into eachother, so needing the style . Looking somthing...
0
by: phil-news-nospam | last post by:
This is expanding on my previous question about gutters in tables. Here are 3 URLs for sample pages I'm testing with. They vary only by the table element attribute cellspacing, with values 0, 1,...
2
by: shapper | last post by:
Hello, How can I define the cell padding and cell spacing of a table using a CSS class? Thanks, Miguel
4
by: Mamluk Caliph | last post by:
For quite some time I've used code as the following to be able to "cut&paste" parts from different headerfiles of the same name. It has worked with GCC, MS, Borland, Keil to name a few. In...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...
0
by: ryjfgjl | last post by:
In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.