Have 2 divs fill out the rest of the page

Question

I'm currently working on a website, but it's important that it must fit on every page. I have 5 divs horizontal. The 3 divs in the middle are fixed sizes, 200 px, 400 px and again 200px. Now I have one on the far left and one of the far right, that should be equally big and fill out the screen no matter what resolution you're viewing the website in. So the middle part should be in the middle, and the 2 divs on the left and right of the middle part should fill out the screen. I have tried several techniques explained in other threads, but most are only for the left, or only for the right part and not working for both left and right. Maybe someone has a solution?

My HTML

<div id="left">
test
</div>
<div id="buttonsleft">
test
</div>
<div id="middle">
test
</div>
<div id="buttonsright">
test
</div>
<div id="right">
test
</div>

My CSS

#left{
    float:left;
    background-color:#C00;
    width:15%;
    height:100%;
}
#buttonsleft{
    float:left;
    background-color:#3F0;
    width:200px;
    height:100%;
}
#middle{
    float:left;
    background-color:#30F;
    width:400px;    
    margin:auto;
}
#buttonsright{
    float:left;
    background-color:#3FF;
    width:200px;
    height:100%;
}
#right{
    float:left;
    background-color:#300;
    width:15%;
    height:100%;
}

Answer 1

Can be easily done using the CSS table layout. See that Working Fidde

If the view port is smaller then 1000px wide, then the divs will shrink. [you didn't specify what should happend if the view port is less then 1000px]

HTML:

<div class="Container">
    <div id="left">left</div>
    <div id="buttonsleft">buttonsleft</div>
    <div id="middle">middle</div>
    <div id="buttonsright">buttonsright</div>
    <div id="right">right</div>
</div>

CSS:

* {
    font-size: 25px;
    color: white;
}
.Container
{
    display: table;
    width: 100%;
}
.Container > div
{
    display: table-cell;
}
#left {
    background-color:#C00;
}
#buttonsleft {
    background-color:#3F0;
    width:200px;
}
#middle {
    background-color:#30F;
    width:400px;
}
#buttonsright {
    background-color:#3FF;
    width:200px;
}
#right {
    background-color:#300;
}