How to make the body of a table scrollable

Let's assume that you have created the following table:

html
<table>
    <thead>
        <tr>
            <td>Name</td>
            <td>Age</td>
            <td>Location</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Erik</td>
            <td>30</td>
            <td>Barcelona</td>
        </tr>
        <tr>
            <td>Andrea</td>
            <td>27</td>
            <td>Barcelona</td>
        </tr>
        <tr>
            <td>Jaruwan</td>
            <td>26</td>
            <td>Bangkok</td>
        </tr>
    </tbody>
</table>

If you want <tbody> to be scrollable, display the rows as a table with fixed layout and set the table body with overflow-y: scroll:

CSS
table{
    width: 100%;
}
table tr{
    display: table;
    width: 100%;
    table-layout: fixed;
}
table tbody{
    display: block;
    max-height: 50px;
    overflow-y: scroll;
}