Source code
Revision control
Copy as Markdown
Other Tools
<!DOCTYPE html>
<html>
<head>
<title>The table element should update its border whenever the caption side changes</title>
<link rel="author" title="Peng Zhou" href="mailto:zhoupeng.1996@bytedance.com">
<link rel="match" href="table-border-paint-caption-change-ref.html">
</head>
<style>
#caption {
caption-side: top;
}
table, tr, td {
border: 1px solid #000000;
}
</style>
<body>
<table>
<caption id="caption">
caption
</caption>
<tbody>
<tr>
<td>a</td>
<td>b</td>
</tr>
<tr>
<td>c</td>
<td>d</td>
</tr>
</tbody>
</table>
<script>
window.addEventListener('load', (e) => {
requestAnimationFrame(() => {
requestAnimationFrame(() => {
document.querySelector('#caption').style.captionSide = 'bottom';
});
});
});
</script>
</body>
</html>