Simple CSS editing

[outofhand]

Hi guys

Wonder if someone can assist me ,

I found a script that works well from dhtml website ,

the once is called "Image with sliding description panel using CSS3 transitions (http://www.dynamicdrive.com/style/csslibrary/item/image_with_sliding_description_panel_using_css3_transitions/)"

This works well, but the images I have , are too round , and need it to be circular edges

any ideas how or where I can achieve this ?

Also the ideal way I want to do this. -

And when you mouse over , the info description displays


Kind Regards

[alexyahaloms]

There are lot of code snippets around to create rounded corner DIVs using images. But here is a simple CSS technique of rounding off the corners of the DIV using some css attributes. This technique will work in Firefox, Safari, Chrome and any other CSS3-compatible browser. This technique will not work in Internet Explorer.

Add following CSS attributes to your element to make its corner round.
selector {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
border: 1px solid;
}

all-corner-rounded-css

To make only Top Left corner rounded, use following CSS.
selector {
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
border: 1px solid;
}