Issue #1545 - Fix border-radius on table row groups, rows, column groups, or columns

Before issue #146, border-radius on row groups, rows, column groups, or columns don't apply to the background of each cell, yet the border-radius on the cell itself does.

After issue #146, the behaviors changed. In this patch, I tried to revert the behaviors of border-radius on table row groups, rows, column groups, or columns back to what happened before issue #146.

Also: Don't override GetBorderRadii in nsBCTableCellFrame.
This commit is contained in:
win7-7 2020-05-12 19:23:47 +03:00 • committed by Roy Tam
commit c399e1938f
12 changed files with 275 additions and 18 deletions

View file

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<title>Table border collapse</title>
<style>
div > span {
display: table-cell;
background-color: black;
height: 100px;
width: 100px;
border-radius: 50px;
}
div {
display: table;
border-collapse: collapse;
}
</style>
</head>
<body>
<div><span></span></div>
</body>
</html>

View file

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<title>Separated border model table</title>
<style>
div > span {
display: table-cell;
background-color: black;
height: 100px;
width: 100px;
border-radius: 50px;
}
div {
display: table;
border-collapse: separate;
}
</style>
</head>
<body>
<div><span></span></div>
</body>
</html>

View file

@ -0,0 +1,44 @@
<!DOCTYPE html>
<title>border-radius and separated border model tables</title>
<style>
body { background: white; color: black }
table { border-collapse: separate; margin: 1em 2px; }
table, td { border: 1px solid black; }
.radius { border: 3px solid teal; background: aqua; color: black; }
</style>
<h1>border-radius and separated border model tables</h1>
<table>
<tbody>
<tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody>
<tbody class="radius">
<tr><td>xx</td><td>xx</td><td>xx
</td></tr><tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody>
<tbody>
<tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody>
</table>
<table>
<tbody><tr class="radius"><td>xx</td><td>xx</td><td>xx
</td></tr><tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody></table>
<table>
<colgroup class="radius"><col><col></colgroup><colgroup><col>
</colgroup><tbody><tr><td>xx</td><td>xx</td><td>xx
</td></tr><tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody></table>
<table>
<colgroup><col><col class="radius"><col>
</colgroup><tbody><tr><td>xx</td><td>xx</td><td>xx
</td></tr><tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody></table>

View file

@ -0,0 +1,44 @@
<!DOCTYPE html>
<title>border-radius and separated border model tables</title>
<style>
body { background: white; color: black }
table { border-collapse: separate; margin: 1em 2px; }
table, td { border: 1px solid black; }
.radius { border: 3px solid teal; background: aqua; color: black; border-radius: 12px }
</style>
<h1>border-radius and separated border model tables</h1>
<table>
<tbody>
<tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody>
<tbody class="radius">
<tr><td>xx</td><td>xx</td><td>xx
</td></tr><tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody>
<tbody>
<tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody>
</table>
<table>
<tbody><tr class="radius"><td>xx</td><td>xx</td><td>xx
</td></tr><tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody></table>
<table>
<colgroup class="radius"><col><col></colgroup><colgroup><col>
</colgroup><tbody><tr><td>xx</td><td>xx</td><td>xx
</td></tr><tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody></table>
<table>
<colgroup><col><col class="radius"><col>
</colgroup><tbody><tr><td>xx</td><td>xx</td><td>xx
</td></tr><tr><td>xx</td><td>xx</td><td>xx
</td></tr></tbody></table>

View file

@ -0,0 +1,44 @@
<!DOCTYPE HTML>
<title>border-radius and border-collapse tables</title>
<style>
body { background: white; color: black }
table { border-collapse: collapse; margin: 1em 2px; }
td { border: 1px solid black; }
.radius { border: 3px solid teal; background: aqua; color: black; }
</style>
<h1>border-radius and border-collapse tables</h1>
<table>
<tbody>
<tr><td>xx<td>xx<td>xx
</tbody>
<tbody class="radius">
<tr><td>xx<td>xx<td>xx
<tr><td>xx<td>xx<td>xx
</tbody>
<tbody>
<tr><td>xx<td>xx<td>xx
</tbody>
</table>
<table>
<tr class="radius"><td>xx<td>xx<td>xx
<tr><td>xx<td>xx<td>xx
</table>
<table>
<colgroup class="radius"><col><col><colgroup><col>
<tr><td>xx<td>xx<td>xx
<tr><td>xx<td>xx<td>xx
</table>
<table>
<col><col class="radius"><col>
<tr><td>xx<td>xx<td>xx
<tr><td>xx<td>xx<td>xx
</table>

View file

@ -0,0 +1,44 @@
<!DOCTYPE HTML>
<title>border-radius and border-collapse tables</title>
<style>
body { background: white; color: black }
table { border-collapse: collapse; margin: 1em 2px; }
td { border: 1px solid black; }
.radius { border: 3px solid teal; background: aqua; color: black; border-radius: 12px }
</style>
<h1>border-radius and border-collapse tables</h1>
<table>
<tbody>
<tr><td>xx<td>xx<td>xx
</tbody>
<tbody class="radius">
<tr><td>xx<td>xx<td>xx
<tr><td>xx<td>xx<td>xx
</tbody>
<tbody>
<tr><td>xx<td>xx<td>xx
</tbody>
</table>
<table>
<tr class="radius"><td>xx<td>xx<td>xx
<tr><td>xx<td>xx<td>xx
</table>
<table>
<colgroup class="radius"><col><col><colgroup><col>
<tr><td>xx<td>xx<td>xx
<tr><td>xx<td>xx<td>xx
</table>
<table>
<col><col class="radius"><col>
<tr><td>xx<td>xx<td>xx
<tr><td>xx<td>xx<td>xx
</table>

View file

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<title>Table border collapse</title>
<style>
div {
background-color: black;
height: 100px;
width: 100px;
border-radius: 50px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<title>Table border collapse</title>
<style>
table {
border-collapse: collapse;
height: 100px;
width: 100px;
}
td {
background-color: black;
border-radius: 50px;
}
</style>
</head>
<body>
<table>
<tr>
<td></td>
</tr>
</table>
</body>
</html>

View file

@ -1,3 +1,8 @@
== bug1375518.html bug1375518-ref.html
== bug1375518-2.html bug1375518-ref.html
== bug1375518-3.html bug1375518-ref.html
== bug1375518-4.html bug1375518-4-ref.html
== bug1375518-5.html bug1375518-5-ref.html
== bc_dyn_cell1.html bc_dyn_cell1_ref.html
== bc_dyn_cell2.html bc_dyn_cell2_ref.html
== bc_dyn_cell3.html bc_dyn_cell3_ref.html