How to create rounded corners to an Element | How to create border-radius using CSS

To create rounded corners to an element like an image for example or a <div> we have to use the border-radius property. Here is an example:  
border radius using CSS
Result after adding border radius


HTML Code

<body>
<img src="myImage.jpg" width="375" height="300" alt="MyImage" />
</body>


CSS Code

<style>
body{ background:#000;}
img{ margin-left:25%;
margin-top:10%;
border-radius:10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;}
</style>



Comments

Check out

CSS Sprites | What are They?

Login form | Using CSS3

Remove Scrollbars from syntaxhighlighter

Adding a button in HTML | styling a button

HTML5 Semantic Tags | What do they mean

How to remove plus and minus characters from input type number

HTML5 | LocalStorage

How CSS3 Works

jQuery Resources | Support and tutorial help