Hey all,

I want to design a box like this to put pictures/videos.

http://i168.photobucket.com/albums/u199/dhushan/randomimage-help.png

How would i go about doing that using CSS or any other simpler ways? any help would be much appreciated.

Thanks.

you can do this in css, for bottom square you can do with use border size. and for rounder corner please check following link it may help you..

http://webdesign.about.com/od/css/a/aa072406.htm

Or you can use images for round corner.

Thank you 'dotflyer' for your reply.

I currently have the bottom square with border size, but the thing is i want to be able to put a design or a background picture which i designed using photoshop as the background .

Thank you 'dotflyer' for your reply.

I currently have the bottom square with border size, but the thing is i want to be able to put a design or a background picture which i designed using photoshop as the background .

really I don't understand, can you please past code here.
If you want background within border you can use
background-image:url(image.jpg);

but can tell you clearly if you past code here.

This is really easy to do,
just slice the top (rounded bit) and the bottom (square bit) then pad the sides to fit your player...