Grow your CSS skills. Land your dream job.

Rounded corners on images

  • # August 28, 2009 at 9:18 am

    Hello,

    I am having this problem: can’t found a way do make rounded corners on <img />. Apparently CSS3 doesn’t work for this. I tried to make

    Code:
    Code:
    .image { widht: 200px; height: 100px; -moz-border-radius: 10px; overflow: hidden; }

    but <img /> just overlaps those corners of parent div. Maybe I should use some javascript? Help please! ;)

    # August 28, 2009 at 12:31 pm

    What would be the purpose? If you want the image to fall behind the css "viewport", why not just cut the image with rounded corners?

    Dor
    # August 28, 2009 at 7:18 pm

    Setting overflow: hidden; might solve your problem, but do know that it only works in firefox.

    Also, if it’s only images, cut them using appropriate graphic tools to the desired shape, and the upload it. less browser stress, and more compatible.

    # August 29, 2009 at 9:47 am

    Cutting pictures with rounded corners won’t work for me… There is design for gallery where thumbnails is with rounded corners, so it won’t be good for my client.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".