Dynamic Div Box
In order for you to create a dynamic div box you should have an image of a box. Then you have to devide it into 3 different images, the top part of it, middle and the bottom. Except the middle part should be only 1 pixel height, it will get the repeat-y rule so that it will become dynamic.
The box itself should be in the witdh you need for it, it will expand only vertically.
Here is an example of a box i have made, first create a container div and two divs inside of it, the containing div will get the middle image and the other two inside divs will be the tox and bottom pictures, the html code should look something like this:
<div id=”box”> <div id=”boxTop”></div> <p>content goes here</p> <div id=”boxBottom”></div> </div>
Now you need to enter the css for this box, and it looks like this:
#box {background:url(url of the middle image) repeat-y; width:459px; float:left; margin:0 25px;}
#boxTop {background:url(url of the top image) no-repeat; height:45px; width:459px;}
#boxBottom {background:url(url of the bottom image) no-repeat; height:20px; width:459px;}
and here are the images already sliced for this box:
This way you get pretty neat box, that you can easily enter any content into it.
