CODEWITHSUNDEEP
javascripthtmlhtml-tablecaa
GC_
GC_

Reputation: 1673

Is there any way to make vertical lines in a table, with JavaScript, HTML or CSS, if the table is missing some of the TDs?

Basically, I would like vertical lines to go all the way to the top of my table, even if there is not a td in the top top of the table.

I am open to using divs or seomthing like that is if it is not too complex.

EDIT: I guess what I want are column dividers, even if there is not tds in that particular row.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title>sample</title>
        <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
        <style type="text/css">
            .sample td{border-left: 1px solid red}
        </style>
    </head>
    <body>
        <table cellspacing='0' class='sample'>
            <tr>
                <td>Test</td><td>Test</td>
            </tr>
            <tr>
                <td>Test</td><td>Test</td><td>Test</td><td>Test</td><td>Test</td>
            </tr>
            <tr>
                <td>Test</td><td>Test</td><td>Test</td><td>Test</td>
            </tr>
        </table>
    </body>
</html>

Upvotes: 0

Views: 1334

Answers (1)

Damien Pirsy
Damien Pirsy

Reputation: 25435

Rewrite like this, is this what you are trying to achieve?

<body>
            <table cellspacing='0' class='sample'>
                <tr>
                    <td>Test</td><td>Test</td><td></td><td></td><td></td>
                </tr>
                <tr>
                    <td>Test</td><td>Test</td><td>Test</td><td>Test</td><td>Test</td>
                </tr>
                <tr>
                    <td>Test</td><td>Test</td><td>Test</td><td>Test</td><td></td>
                </tr>
            </table>
</body>

Upvotes: 1

Related Questions