Hi everyone...

I m designing the web-site right now.
But one proble is to make the corners rounded.

I dont want the css help which call the image as rounded corner....
Is there any css you know which directly rounded the corners in the page...

Thanks .
With regards...

Sure you can
1- include this file

<script type="text/javascript" src="shadedborder.js"></script>

2- write your Css as follow

<style type="text/css">
/* <![CDATA[ */

/* One simple border definition */
#my-border { padding:20px; width:30%; margin:200px auto; color:#fff; }
#my-border, #my-border .sb-inner { background:#444 url(grad.png) repeat-x; }

/* The following is just for making the page look "cool" - simply ignore it */
html { font-family:sans-serif; background:#444; color:#ddd; }
html, body { margin:0; padding:0; }
p { margin:5px 0; }
.headfoot { text-align:right; padding:10px; margin:0; }
.headfoot h1 { font-size:1.3em; padding:0; margin:0; }
.headfoot a { color:#fff; }
#content { background:url(back.jpg); padding:10px 0; }

/* ]]> */

3- make div including all page contents with id ="my-border"

4- write this code in body

<script language="javascript" type="text/javascript">
    var myBorder = RUZEE.ShadedBorder.create({ corner:8, shadow:16 });

complete project

Member Avatar


IE is a crap browser, but there again we all know that right?

My solution would be:

-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;

This should work in all browsers except IE. IE9 should support the last statement. The multiple div/tag solution for IE is horrible, although I have used it in the past. Anything that means you have to change the HTML or include presentational markup is evil in my book. I would suggest that you just ignore rounded corners for IE. Will it break the site? If all your corners are 'border-radiused' as opposed to static images or js-induced rounding, then the IE view shouldn't look too bad.

thanks for your great reply regarding the rounded corner css..

Thanks again/...