CSS Problem with rounded corners in chrome
 

hello , i have been trying to create a sort of image slideshow. the problem is that in firefox it displays correctly
with rounded corners , but in chrome the rounded corners ( using css3 ) are being 'hidden' at the back although it is there .
here's a demo of my work :
http://anisa.me/work/
Any help would be highly appreciated .

If you're using CSS3, then you can simple use the border-radius option, and that saves in having to add any images, like we used to struggle with in the past.

You're running into browser inconsistencies in the way CSS rounded corners are displayed. Yes, foreground images extend beyond the rounded corners in several browsers (not just Chrome).

You can try the old, tried and true kludge of rounded images in the corners, or assign the photos to be background images in your divs to which a CSS class has been assigned that contains all the various flavors of rounded browser-specific CSS gibberish (you'll have much better luck clipping background rather than foreground images), or you can try assigning that CSS class to the foreground images themselves. Then there are always various combinations of all the above that you can try.

Or you can wash your hands of it all until that day when Hell freezes over, pigs fly and all the browsers start rendering everything the same way.