Ryan
Ryan

Reputation: 319

Is there any way to give an image round borders using CSS?

I have an image which is square 100px by 100px.

Was wondering if there was any way for giving an image rounded borders using CSS?

Similar to the border-radius property:

-moz-border-radius: 15px;
border-radius: 15px;

I would prefer not to resort to Javascript.

Thanks.

Upvotes: 0

Views: 226

Answers (1)

Babiker
Babiker

Reputation: 18798

-moz-border-radius: 15px; and -webkit-border-radius:15px; should work fine in a standards compliant browser. Another technique:

<div style="border: 0px solid; border-radius: 30px; -moz-border-radius: 30px; -khtm border-radius: 30px; -webkit-border-radius: 30px; width: 100px; height: 100px; background: url('img.jpg');">

Upvotes: 1

Related Questions