如何在css中制作面板内的小方框

Question

我的项目正在使用zurb foundations，但我对此并不了解。

我需要像这样设计布局。这是粗略的绘图

标题需要位于中心，小方框内的文字也应位于中心。

这就是我试过的

http://jsfiddle.net/utnobcL1/

该框应该在300 width , 400height

附近

Answer 1

http://jsfiddle.net/utnobcL1/2/

这是给你的快速模型。

.container {
    width:100%;
    border:1px solid black;
}

.box {
    width:100px;
    margin:auto;
    border:1px solid black;
    margin-top:10px;
}

.header {
    text-align:center;
    background-color:grey;
}

<强>更新

http://jsfiddle.net/utnobcL1/4/