htmlcsshtml-tablexhtml-transitional

Table Styling with XHTML 1.0 Transitional


I am trying to add a border and padding to the table row of XHTML 1.0 Transitional web page (see code below to repro). I know that if I change the type of page to something else, I will be able to add borders and padding to the table rows and cells. But in XHTML 1.0 Transitional, it doesn't work at all.

Considering that I can't change the DOCTYPE, what am I suppose to do add a border and padding to the table?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <style>
            table
            {
                border: solid 1px black;
            }

            tr
            {
                /* Doesn't work */
                margin: 10px;
                border: solid 1px black;
            }
        </style>
    </head>
    <body>
        <table>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                </tr>
                <tr>
                    <td>4</td>
                    <td>5</td>
                    <td>6</td>
                </tr>                
            </tbody>
        </table>
    </body>
</html>

Solution

  • Try seeing if the border and margin works on the td.

    td
    { 
        margin: 10px; 
        border: solid 1px black; 
    } 
    

    If it does you'll have to make it top/bottom margin only for center cells.