Easy Border Radius For Rounded Corners
There’s a very handy css border radius generator that quickly creates the css needed to round the corners of almost any web page element. You can check it out here: http://css-radius.heroku.com/
Just slide the controls to the desired radius for each corner then copy/paste the generated code. You can round off any combination of corners that you want, left, right, top, bottom and the code is shown instantly.
If you are viewing this page in Internet Explorer you will only see a square box below. Get a better browser!
Here’s an example of how it works:
<div class="radius-example" style="width:400px;
height:300px;background:#ccccff; margin:40px 10px 10px 0;
padding:10px; -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;"><p>Contents of the division </p></div>
And that’s all there is to it.
