I client has asked me to make a site from a psd and I have been able to do everything he says so far but I am not sure how to do the borders. You can see them here:
He has asked for the site to be fluid. With that I am unsure how I should continue converting the site to css. Should I just cut out those as images and than use border img? on left and right. Can I even do that? Any help would be greatly appreciated.
You could have 2 nested divs, placing one on each side, or you could make use of two empty elements (<div> or whatever) and absolutely place them inside the wrapper, height:100% and repeat the image down the y axis, use top:0;left:0;(or right:0) etc to place on each side (position:relative will be needed on the wrapper)
Your welcome for the help thus far, but to answer your second question; same as above, but, then you have the fading graphic (of a fixed height probably) placed on the outer edges of the header and footer. You’d have to tool with it to get pixel perfection. That’s how I’d first attempt it anyhow…
Jeese… Never done that, but if I were to try, I would first attempt it like (I would actually probably just ask like you lol)…
Make the left/right wrapper shadows, make the header and footer fluid, then make the top/bottom left/right fading shadows taller than you would ever need, and then give overflow hidden on the header/footer (that will probably hide the overflow?). Or, maybe I’m totally wrong, that’s my first thought on how though.
If you use this for the design process you won’t run into these problems
I’m working on a solution at the moment - Because it’s at least 4 images you’ll need you’ll need at least for html elements to hang them off. If multiple background images were supported you could do it all with one div - or indeed the body.