visibility-collapse-col-005.html

Enable keyboard shortcuts

This WPT test may be referenced by the following Test IDs:
- /css/css-tables/visibility-collapse-col-005.html - WPT Dashboard Interop Dashboard

<!doctype html>

<meta charset="utf-8">

<script src='/resources/testharness.js'></script>

<script src='/resources/testharnessreport.js'></script>

<link rel="author" title="Joy Yu" href="mailto:joysyu@mit.edu">

<link rel="help" href="https://drafts.csswg.org/css-tables-3/#computing-the-table-width">

<style>

    td {

        padding: 0;

</style>

<h1>Visibility collapse</h1>

<a href="https://drafts.csswg.org/css-tables-3/#computing-the-table-width">Spec</a>

<p>

Setting a spanning column to visibility:collapse changes table width but

not height. The right two columns here have been collapsed.

</p>

<table id="test" style="border-collapse: collapse;">

<colgroup>

    <col style="background:#00F"/>

    <col span="2" style="background:#F00; visibility: collapse"/>

</colgroup>

<tbody>

    <tr>

        <td><div style="width: 100px; height: 100px"></div></td>

        <td><div style="width: 10px; height: 10px"></div></td>

        <td><div style="width: 1px; height: 1px"></div></td>

    </tr>

    <tr>

        <td><div style="width: 100px; height: 100px"></div></td>

        <td><div style="width: 10px; height: 10px"></div></td>

        <td><div style="width: 1px; height: 1px"></div></td>

    </tr>

</tbody>

</table>

<script>

    tests = [

            document.getElementById('test').offsetHeight,

            200,

            "col visibility:collapse doesn't change table height",

],

            document.getElementById('test').offsetWidth,

            100,

            "col visibility:collapse changes table width"

]];

    for (i = 0; i< tests.length; i++) {

        test(function()

                assert_equals.apply(this, tests[i]);

},

            tests[i][2]);

};

</script>