Creating a contact form using divs with 4 extra divs for "Corners"?

Question

Hi there,

i have tried to create a contact form (a standard form, square in nature but with rounded corners)... I can't use the CSS3 specs so i have an image for each corner..

I have set the images on the background-image and no repeat but it seems if the div is empty then it doesn't display, is there a hack - although prefer an alternative clean method :-)

So on the top level i presume i have 1 div for the Upper-Left (corner) and then the upper-middle (just has a color assigned) and then a div for the upper-right (corner) .. so i presume i need to float all these to the left???

Or am i missing something?

Thanks in advance

Answer 1

You can give   inside the corner div's so that the background images will appear.

Answer 2

possibly I've mis-understood the question, but have you set a static width and height for the corner divs? the div won't auto-resize to match your image size.

Answer 3

The clean method is use border-radius and just let IE people see square corners. It won't kill them.

But since you said you can't do that... Elements have no idea how large their background is, and won't do anything special to show the whole thing. You have to give the corner <div>s an explicit height and width, based on the image you're using for the corner, so that they're large enough to show their background.