Re: [WSG] un-border-collapse, possible?
On Sep 20, 2010, at 7:15 PM, David Hucklesby wrote: Here's my follow-up. I managed to find a solution of sorts. See here: http://webwiz.robinshosting.com/temp/table-border/ I cheated! ;) Cordially, David Hi David, Nice trick! I was obsessed with the 'table', never occur to put the border in a div with no padding and margin. So simple yet effective! Thank you very much! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] un-border-collapse, possible?
On 9/19/10 2:17 PM, tee wrote:
Hi David,
Just got a chance to revisit this issue.
I want the border radius for table.
[...]
I needed to do something like #6 (still not perfect due to the space
in th cell) without the hassle of #6 codes, but it's not possible
with simple code like this:
table {border-radius: 15px; border-collaspe: collapse} table, th, td
{border:1px solid #369; }
http://www.lotusseedsdesign.com/css-test/table/table.html
tee
On Sep 15, 2010, at 5:59 PM, David Hucklesby wrote:
On 9/15/10 10:42 AM, tee wrote:
When border-collapse is declared, it can't do border-radius.
I have this: table {border-collapse:collapse}
[...]
I'm unclear as to whether you want the table border rounded, or the
table cells? I'm going to assume you mean the individual cells,
since you mention border-collapse--which applies to the cells.
Aside: the border-collapse does not affect the border on the
table. But you already knew that...
Ahh! Okay--I was wrong. As you demonstrate, the collapsed borders on
the cells extend to the edge of the table, beyond the rounded part of
the table's own border. So they _do_ affect the border on the table!!!
I was going to suggest using the rules attribute of the table, but I
see that this, too, is buggy in several browsers...
I'll play with this later, and let you know if I come up with something.
Sorry to have misled you.
Cordially,
David
--
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] un-border-collapse, possible?
On 9/20/10 2:48 PM, David Hucklesby wrote:
On 9/19/10 2:17 PM, tee wrote:
Hi David,
Just got a chance to revisit this issue.
I want the border radius for table.
[...]
I needed to do something like #6 (still not perfect due to the space
in th cell) without the hassle of #6 codes, but it's not possible
with simple code like this:
table {border-radius: 15px; border-collaspe: collapse} table, th, td
{border:1px solid #369; }
http://www.lotusseedsdesign.com/css-test/table/table.html
tee
On Sep 15, 2010, at 5:59 PM, David Hucklesby wrote:
On 9/15/10 10:42 AM, tee wrote:
When border-collapse is declared, it can't do border-radius.
I have this: table {border-collapse:collapse}
[...]
I'm unclear as to whether you want the table border rounded, or the
table cells? I'm going to assume you mean the individual cells,
since you mention border-collapse--which applies to the cells.
Aside: the border-collapse does not affect the border on the
table. But you already knew that...
Ahh! Okay--I was wrong. As you demonstrate, the collapsed borders on
the cells extend to the edge of the table, beyond the rounded part of
the table's own border. So they _do_ affect the border on the table!!!
[...]
I'll play with this later, and let you know if I come up with something.
Sorry to have misled you.
Here's my follow-up. I managed to find a solution of sorts. See here:
http://webwiz.robinshosting.com/temp/table-border/
I cheated! ;)
Cordially,
David
--
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] un-border-collapse, possible?
Hi David,
Just got a chance to revisit this issue.
I want the border radius for table. While setting up an example page I realized
why I thought border radius isn't possible was due to the background colors I
had for the table and td cell, with the combination of border radius for table.
Border collapsing is handy and clean when I want to have consistent borders
width in th and td cells (#1a) without having to declare border
(left/right/top/bottom) individually , and I'd been using this for years.
I needed to do something like #6 (still not perfect due to the space in th
cell) without the hassle of #6 codes, but it's not possible with simple code
like this:
table {border-radius: 15px; border-collaspe: collapse}
table, th, td {border:1px solid #369; }
http://www.lotusseedsdesign.com/css-test/table/table.html
tee
On Sep 15, 2010, at 5:59 PM, David Hucklesby wrote:
On 9/15/10 10:42 AM, tee wrote:
When border-collapse is declared, it can't do border-radius.
I have this: table {border-collapse:collapse}
Because the site has many table layouts, it's easier to declare
border-collapse in the table, but in one specific table in a given
page I want to use border-radius, however I can't overwrite the
border-collapse:collapse. Another two options are separate and
inherit.
?
I'm unclear as to whether you want the table border rounded, or the
table cells? I'm going to assume you mean the individual cells, since
you mention border-collapse--which applies to the cells.
Yes, to apply rounded corners to the cells, you will need to use these
CSS properties:
border-collapse: separate;
border-spacing: length [ length ];
Now you can apply border-radius to the cells (I have done it...)
Getting the layout to match in IE 5-7 may be problematic, as the
border-spacing property is ignored. The only option here is to use the
cellspacing attribute of the table itself. Not a good option either,
as you can only set a single value, rather than the x and y values
that are optional in CSS border-spacing.
Aside: the border-collapse does not affect the border on the table. But
you already knew that...
Cordially,
David
--
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] un-border-collapse, possible?
On Sep 19, 2010, at 2:17 PM, tee wrote: Hi David, Just got a chance to revisit this issue. I want the border radius for table. While setting up an example page I realized why I thought border radius isn't possible was due to the background colors I had for the table and td cell, with the combination of border radius for table. Border collapsing is handy and clean when I want to have consistent borders width in th and td cells (#1a) without having to declare border (left/right/top/bottom) individually , and I'd been using this for years. Also, something I'd just discovered, the border collapse is a remedy for an IE8 table bug which the table has a 100% width but it can't expand to the container's width. A bug I stumble on a couple times and got it fixed but didn't quite know how I got it sorted, until just now, I removed the border collapse in a site that I was working to try to get the radius effect, and found that it triggered the table bug. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] un-border-collapse, possible?
On 15 Sep 2010, at 18:42, tee wrote:
I have this:
table {border-collapse:collapse}
I can't overwrite the border-collapse:collapse. Another two options are
separate and inherit.
separate is the opposite of collapse, they aren't independent states. A table
is either one or the other (with inherit meaning to inherit the value from the
parent element).
--
David Dorward
http://dorward.me.uk
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] un-border-collapse, possible?
On 9/15/10 10:42 AM, tee wrote:
When border-collapse is declared, it can't do border-radius.
I have this: table {border-collapse:collapse}
Because the site has many table layouts, it's easier to declare
border-collapse in the table, but in one specific table in a given
page I want to use border-radius, however I can't overwrite the
border-collapse:collapse. Another two options are separate and
inherit.
?
I'm unclear as to whether you want the table border rounded, or the
table cells? I'm going to assume you mean the individual cells, since
you mention border-collapse--which applies to the cells.
Yes, to apply rounded corners to the cells, you will need to use these
CSS properties:
border-collapse: separate;
border-spacing: length [ length ];
Now you can apply border-radius to the cells (I have done it...)
Getting the layout to match in IE 5-7 may be problematic, as the
border-spacing property is ignored. The only option here is to use the
cellspacing attribute of the table itself. Not a good option either,
as you can only set a single value, rather than the x and y values
that are optional in CSS border-spacing.
Aside: the border-collapse does not affect the border on the table. But
you already knew that...
Cordially,
David
--
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
