Hi Koff, the link isn’t working for me, but border-radius will only effect background images, not inline images. So you’d have to really customize the slideshow content before you could round the corners.
Thread Starter
Koff
(@orenkolker)
10x
The link works for me: http://www.brownbatterystudios.com/sixthings/2011/04/25/css3-rounded-corners-avoiding-image-clipping-problems/
it says that with the following markup:
<div class="rounded">
<img src="…" height="50" width="100" />
</div>
The following css gets the border rounded corners right:
div.rounded {
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.65);
height: 50px;
overflow: hidden;
width: 100px; }
Which it does; but not for the slides.
I’m not sure if it’s a conflict with the jQuery or just that it doesn’t work in all browsers, but I have had trouble rounding the corners on inline images in the past, so I have always either rounded them in Photoshop, or used background images instead. This post on background images as slides has an example that could get you set in the right direction.
Thread Starter
Koff
(@orenkolker)
Hi,
I used the background trick, and it works.
Thanks!!!
Koff
