Is there a way to stop scrollbars from affecting the box model measurements?

I have made a table in the way described at imaputz.com, but with alternating colors for the rows. Because of these colors there is a distinct difference in the row color and the color surrounding the table, and that makes the table look bad when there is to few rows to need the scrollbar since the right edge of the tbody does not line up with the right edge of the thead (which also has a color distinct from the surrounding background).

My idea now is: If I could somehow stop the sidebar from affecting the layout of its containing elements (so that the scrollbar overlaps some of its containing elements, potentially), I could then pad the rows a bit to make sure that the scrollbar never overlaps something important.

Is there a way to achieve this scroll bar behaviour, preferably without Javascript?

Example:

<div id="list">
    <table>
        <thead>
            <tr>
                <th>
                    DATUM
                </th>
                <th>
                    TID
                </th>
                <th>
                    TEMPERATUR
                </th>
                <th>
                    STATUS
                </th>
                <th>
                    ÅTGÄRD
                </th>
            </tr>
        </thead>
        <tbody>
            <tr class="odd row0">
                <td>
                    2011 09 22
                </td>
                <td>
                    04:39
                </td>
                <td>
                    -264.2
                </td>
                <td>
                </td>
                <td>
                    Antibiotika behandling
                </td>
            </tr>
            <tr class="even row1">
                <td>
                    2011 09 22
                </td>
                <td>
                    04:36
                </td>
                <td>
                    -264.2
                </td>
                <td>
                </td>
                <td>
                    Under behandling
                </td>
            </tr>
            <tr class="odd row2">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:29
                </td>
                <td>
                    -264.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>
            <tr class="even row3">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:29
                </td>
                <td>
                    -273.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>
            <tr class="odd row4">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:29
                </td>
                <td>
                    -270.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>

            <!-- Uncomment to get scrollbars 

            <tr class="even row5">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:29
                </td>
                <td>
                    -273.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>
            <tr class="odd row6">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:29
                </td>
                <td>
                    -270.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>
            <tr class="even row7">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:29
                </td>
                <td>
                    -273.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>
            <tr class="odd row8">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:28
                </td>
                <td>
                    -272.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>
            <tr class="even row9">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:28
                </td>
                <td>
                    -262.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>
            <tr class="odd row10">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:28
                </td>
                <td>
                    -268.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>
            <tr class="even row11">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:28
                </td>
                <td>
                    -273.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>
            <tr class="odd row12">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:28
                </td>
                <td>
                    -269.2
                </td>
                <td>
                    Förhöjd
                </td>开发者_StackOverflow
                <td>
                </td>
            </tr>
            <tr class="even row13">
                <td>
                    2011 09 21
                </td>
                <td>
                    19:27
                </td>
                <td>
                    -270.2
                </td>
                <td>
                    Förhöjd
                </td>
                <td>
                </td>
            </tr>

             -->

        </tbody>
        <tfoot>
        </tfoot>
    </table>
</div>

Css:

#list {
    width:60%;
    float:left;
}

#list table {

    font-weight:normal;
    border-collapse:collapse;
    text-align:center;
    font-size:smaller;

}

#list table thead tr {
    display:block;
    position:relative;
}

#list table, #list th, #list td
{
    border:1px solid white;
}

#list table tr td, 
#list table tr th
{
    width:65px;
}

#list table tr td + td, 
#list table tr th + th
{
    width:40px;
}

#list table tr td + td + td, 
#list table tr th + th + th
{
    width:100px;
}

#list table tr td + td + td + td, 
#list table tr th + th + th + th
{
    width:80px;
}

#list table tbody tr td + td + td + td + td
{
    width:150px;
}

/* The last column header is a special case, to compensate for
   the scrollbar's width, which would otherwise offset the
   columns a bit to the left. */
#list table thead tr th + th + th + th + th
{
    width:166px;
}

#list th {
    background-color:#E5E5E5;
}

#list .odd
{
    background-color:#E5E5E5;
}
#list .even
{
    background-color:#CBCBCB;
}

#list table tbody {
    display:block;
    overflow:auto;
    height:206px;
}

The example got a little large, sorry about that.

---

Original code jsfiddle: http://jsfiddle.net/ZhSK6/

This seems to solve it: http://jsfiddle.net/ZhSK6/1/

#list table thead tr th + th + th + th + th
{
    width:166px;
}

---

Update on the secondary problem: http://jsfiddle.net/lollero/ZhSK6/15/

and a little more plain example: http://jsfiddle.net/lollero/ZhSK6/14/

---

_{Edit: Updated my examples. ( Changed the jquery version up so that it can actually be found from google servers...for a while at least. )}