表格单元格和表格页脚组

Question

http://jsfiddle.net/hqu8N/

<div id="container">
    <div id="one"><p>one</p></div>
    <div id="two"><p>two</p></div>
    <div id="footer"><p>footer</p></div>
</div>

#container {
    display: table;
    width: 200px;
    height: 200px;
    background-color: red;
    border-spacing: 5px;
}

#one {
    display: table-cell;
    background-color: yellow;
}

#two {
    display: table-cell;
    background-color: blue;
}

#footer {
    display: table-footer-group;
    background-color: green;
}

基本上我希望绿色页脚延伸到蓝色ID的末尾。绿色页脚和黄色ID之间也是10 px的空间而不是5px。我做错了什么？