In order to access this site you need to enable JavaScript!

You are here: Reference > CSS > properties > caption-side

caption-side property

Browser support:

8

Specifies the position of the caption box within a table element.

Note: The caption-side property is supported in Internet Explorer from version 8.

Earlier versions of Internet Explorer support the align attribute to provide similar functionality, but that attribute is deprecated in HTML 4.01. If you want to align a caption element to the top or bottom side of a table element, use the vAlign attribute in Internet Explorer earlier than version 8.

JavaScript page for this property: captionSide. You can find other example(s) there.

Possible values:

One of the following values:

bottom

Positions the caption box below the table box.

inherit

Takes the value of this property from the computed style of the parent element.

left

Positions the caption box to the left of the table box.

right

Positions the caption box to the right of the table box.

top

Positions the caption box above the table box.

Default: top.

Example HTML code 1:

This example illustrates the use of the caption-side property:

<head>
    <style>
        .example {
            caption-side: bottom; 
            width: auto;
            text-align: center;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <table>
        <caption valign="bottom" class="example">Fruits</caption>
        <tr>
            <td>Apple</td>
            <td>13.46</td>
        </tr>
        <tr>
            <td>Pear</td>
            <td>35.21</td>
        </tr>
        <tr>
            <td>Peach</td>
            <td>23.12</td>
        </tr>
    </table>
</body>