HTML CSS grid 3x3 with divs

Question

I'm no novice at HTML/PHP. Just... A bit somewhat incapable. I need something like this:

I know its only a rough sketch, and rough being an under estimate, but could someone help? preferably done in html css.

If anyone can help, could you work to this?

Width: 900px 
bg colour:e9e9e9 
align:center 
Top, bottom, left and right side images repeat 
Corner images don't repeat 
Corner images: 40 x 40 
Side/top/bottom images: repeat

I have this so far: jsfiddle

Answer 1

Maybe this could be useful : jsfiddle

Basically it's a HTML cover with basic CSS and images added for exemple. You only need now to add the size and color you wish to add in the CSS properties, such as :

width : 900px;
background-color : #E9E9E9;
align : center

Your exemple was good, but I think you would have maybe had a better result by doing only the HTML first, and then the CSS. If you allow me to give you an advice, you should do the positionning of divs with a simple CSS such as border : 1px solid black; height : 15px; width : 15px border : 1px solid black; height : 15px; width : 15px border : 1px solid black; height : 15px; width : 15px , and make a strong HTML code based on that. Then switch to CSS to make it look good. And at last, you may add the content.