padding problem..

hi,

I discovered recently, the hard way, that adding padding-right or
padding-left to a <td> adds to the width of <td>!!

so how do I add left- or right-padding to a <td> without adding to the
width of it (short of putting a div inside each <td> and making it a
specific width?)

what's the point of "padding" property if instead of adding just the
specified padding it WIDENS element you're applying padding to?????

thank you...

maya wrote:

hi,

I discovered recently, the hard way, that adding padding-right or
padding-left to a <td> adds to the width of <td>!!

Yes, that's what it is supposed to do. Per the standards.

so how do I add left- or right-padding to a <td> without adding to the
width of it (short of putting a div inside each <td> and making it a
specific width?)

I'm not sure what you are trying to do, but my guess is that you want to
increase the space between the cells without increasing the size of the
block which is affected by the background colour, background image, etc.

To do this you can specify (or increase) the TD's margin.

HTH

C A Upsdell wrote:

maya wrote:
hi,

I discovered recently, the hard way, that adding padding-right or
padding-left to a <td> adds to the width of <td>!!

Yes, that's what it is supposed to do. Per the standards.

so how do I add left- or right-padding to a <td> without adding to the
width of it (short of putting a div inside each <td> and making it a
specific width?)

I'm not sure what you are trying to do, but my guess is that you want to
increase the space between the cells without increasing the size of the
block which is affected by the background colour, background image, etc.

To do this you can specify (or increase) the TD's margin.

HTH

td's margin? as in <td class="x">

..x {margin-right:10px} ???

this will add PADDING?????

I thought margin was for OUTSIDE ELEMENT (outside border whether visible
or not..), padding for INSIDE ELEMENT..

oh brother..

I have only one column in table, and need padding ONLY on the right...

thank you....

maya wrote:

C A Upsdell wrote:
maya wrote:
hi,

I discovered recently, the hard way, that adding padding-right or
padding-left to a <td> adds to the width of <td>!!

Yes, that's what it is supposed to do. Per the standards.

so how do I add left- or right-padding to a <td> without adding to
the width of it (short of putting a div inside each <td> and making
it a specific width?)

I'm not sure what you are trying to do, but my guess is that you want
to increase the space between the cells without increasing the size of
the block which is affected by the background colour, background
image, etc.

To do this you can specify (or increase) the TD's margin.

HTH


td's margin? as in <td class="x"

.x {margin-right:10px} ???

this will add PADDING?????

No, it sets a right margin. The CSS you cite will increase the spacing
to the right of the cell.

I thought margin was for OUTSIDE ELEMENT (outside border whether visible
or not..), padding for INSIDE ELEMENT..

Inside, outside, it is all semantics. The margin is a property of the
cell, so it might be considered inside, but the margin is not affected
by the border or the background colour, so it might be considered
outside too. It is just how you look at it.

maya wrote:

hi,

I discovered recently, the hard way, that adding padding-right or
padding-left to a <td> adds to the width of <td>!!

This sounds like a box model issue. I'm not sure this applies to
tables cells but it does to other boxes.

Try taking this out of standards mode and see if that "fixes" your
problem. There is a CSS box setting but I don't believe it is widely
supported.

Others should come along and correct this. I'm not feeling well
today, so I did not verify this

Jeff

so how do I add left- or right-padding to a <td> without adding to the
width of it (short of putting a div inside each <td> and making it a
specific width?)

what's the point of "padding" property if instead of adding just the
specified padding it WIDENS element you're applying padding to?????

thank you...

On 2008-02-20, C A Upsdell <cupsdell (AT) upsdell (DOT) invalid> wrote:

maya wrote:
[...]
so how do I add left- or right-padding to a <td> without adding to the
width of it (short of putting a div inside each <td> and making it a
specific width?)

I'm not sure what you are trying to do, but my guess is that you want to
increase the space between the cells without increasing the size of the
block which is affected by the background colour, background image, etc.

To do this you can specify (or increase) the TD's margin.

Margin properties don't apply to elements that are display: table-cell
(i.e. TDs usually).

If you want gaps between the cells you set border-spacing on the table
(or if you need support in IE use the cellspacing attribute instead).

On Feb 20, 1:51*pm, Ben C <spams... (AT) spam (DOT) eggs> wrote:

On 2008-02-20, C A Upsdell <cupsd... (AT) upsdell (DOT) invalid> wrote:

maya wrote:
[...]
so how do I add left- or right-padding to a <td> without adding to the
width of it (short of putting a div inside each <td> and making it a
specific width?)

I'm not sure what you are trying to do, but my guess is that you want to
increase the space between the cells without increasing the size of the
block which is affected by the background colour, background image, etc.

To do this you can specify (or increase) the TD's margin.

Margin properties don't apply to elements that are display: table-cell
(i.e. TDs usually).

If you want gaps between the cells you set border-spacing on the table
(or if you need support in IE use the cellspacing attribute instead).

Yep yep. U wanna add:

border-collapse: separate;

But taht would make the col "gutter", not one cell.

In IE u can:

td#cell1{
position: relative;
left: 10px;
}

Moves the cell.

D

-G

On 23 fév, 03:30, Galaxy <fitcal... (AT) gmail (DOT) com> wrote:

On Feb 20, 1:51 pm, Ben C <spams... (AT) spam (DOT) eggs> wrote:

U wanna add:

border-collapse: separate;

No need to; separate is the initial, default border-collapse value.

In IE u can:

td#cell1{
position: relative;
left: 10px;

}

Moves the cell.

Relatively positioning a table cell is not recommendable, not
required.
First of all, we don't even know the webpage context of the OP.

"Positioning and floating of table cells can cause them not to be
table cells anymore, according to the rules in section 9.7."
http://www.w3.org/TR/CSS21/tables.html#table-layout

"The effect of 'position:relative' on table-row-group, table-header-
group, table-footer-group, table-row, table-column-group, table-
column, table-cell, and table-caption elements is undefined."
http://www.w3.org/TR/CSS21/visuren.html#choose-position

Regards, Gérard