[csswg-drafts] [css-borders-4] border list vs. border conflict resolution in tables (#13452)

bradkemper has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-borders-4] border list vs. border conflict resolution in tables ==
It is unclear to me how best to resolve conflicts between adjacent table cells in a border collapsing table when they have different number of borders, and what "in to out" border list order means when two adjacent table cells share the same border. 

Here is the conflict resolution section from CSS2, along with my comments on how I think it should apply to border lists. 

> 17.6.2.1 Border conflict resolution
> 
> In the collapsing border model, borders at every edge of every cell may be specified by border properties on a variety of elements that meet at that edge (cells, rows, row groups, columns, column groups, and the table itself), and these borders may vary in width, style, and color. The rule of thumb is that at each edge the most "eye catching" border style is chosen, except that any occurrence of the style 'hidden' unconditionally turns the border off.
> 
> The following rules determine which border style "wins" in case of a conflict:
> 
> 1. Borders with the 'border-style' of 'hidden' take precedence over all other conflicting borders. Any border with this value suppresses all borders at this location.

I think we can just extend this to say that if any border for the list is `none`, treat it the same way, i.e. suppresses all borders at this location. I don't think there is a reasonable way to use `hidden` in some other way that doesn't get too complicated. 

I really don't think we need any special rules for de-listifying altogether if `border-style` is or has `none` or `hidden`, though for tables, the visible effect of `hidden` would be similar. 

> 2. Borders with a style of 'none' have the lowest priority. Only if the border properties of all the elements meeting at this edge are 'none' will the border be omitted (but note that 'none' is the default value for the border style.)

This should only be the case if all the borders in the list were none, as in the case of `border-style: none` (since the `none` would repeat for every `border-width`). If only some of the borders in the list have none, then the border still has non-none values and widths that can be used for the subsequent conflict resolution. 

> 3. If none of the styles are 'hidden' and at least one of them is not 'none', then narrow borders are discarded in favor of wider ones. If several have the same 'border-width' then styles are preferred in this order: 'double', 'solid', 'dashed', 'dotted', 'ridge', 'outset', 'groove', and the lowest: 'inset'.

This seems fine if there are the same number of borders to compare, but what if there aren't? Maybe longest list wins for number of borders, and loser repeats borders to match. 

Also, are you comparing the outermost border of the first cell with the  innermost of the adjacent cell and vice versa? I think that would be most reasonable for symmetry, but I'd like to hear what others think.

> 4. If border styles differ only in color, then a style set on a cell wins over one on a row, which wins over a row group, column, column group and, lastly, table. When two elements of the same type conflict, then the one further to the left (if the table's 'direction' is 'ltr'; right, if it is 'rtl') and further to the top wins.

I assume this is comparing individual borders in the list against the same border from the other element' list. And in order for it to be the same border, you have to reverse the order of the other element's list, ie the outermost border of one element would be the innermost of the other. Otherwise it isn't really the same border. 

For collapsing border widths in tables, we have this:

> The diagram below shows how the width of the table, the widths of the borders, the padding, and the cell width interact. Their relation is given by the following equation, which holds for every row of the table:
> 
> row-width = (0.5 * border-width0) + padding-left1 + width1 + padding-right1 + border-width1 + padding-left2 +...+ padding-rightn + (0.5 * border-widthn)
> 
> Here n is the number of cells in the row, padding-lefti and padding-righti refer to the left (resp., right) padding of cell i, and border-widthi refers to the border between cells i and i + 1.

I think you have to compare each width against the corresponding width in the list of the cell next to it.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/13452 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 4 February 2026 19:02:06 UTC