어떻게하면 CSS 안에 패널 안에 작은 정사각형 박스를 만들 수 있습니까

Question

내 프로젝트는 zurb foundations을 사용하고 있지만 그것에 대해 많이 알지 못합니다.

이렇게 레이아웃을 디자인해야합니다. 이것은 거친 그림입니다

머리글은 중앙에 있어야하고 작은 상자 안의 텍스트도 가운데에 있어야합니다.

이 내가 여기 당신을 위해 빠른 모델의 상자 주위에 300 width , 400height

Answer 1

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

해야

http://jsfiddle.net/utnobcL1/

을 시도하는 것이다.

.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; 
} 

는 UPDATE

내가 작은 상자의 중앙에 큰 숫자 786을 makr 수있는 ​​방법을 http://jsfiddle.net/utnobcL1/4/