Return to Snippet

Revision: 15256
at June 29, 2009 12:28 by webdevelopertut


Initial Code
HTML Code:

<b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b>
<div class="contentb">
<div>Round Border!!</div>
</div>
<b class="b4"></b><b class="b3"></b><b class="b2"></b><b class="b1"></b>

CSS Code:
.b1, .b2, .b3, .b4{font-size:1px; overflow:hidden; display:block;}
.b1 {height:1px; background:#888; margin:0 5px;}
.b2 {height:1px; background:#fff; border-right:2px solid #888; border-left:2px solid #888; margin:0 3px;}
.b3 {height:1px; background:#fff; border-right:1px solid #888; border-left:1px solid #888; margin:0 2px;}
.b4 {height:2px; background:#fff; border-right:1px solid #888; border-left:1px solid #888; margin:0 1px;}
.contentb {background: #fff; border-right:1px solid #888; border-left:1px solid #888;}
.contentb div {margin-left: 5px;}

Initial URL
http://htmlcsstutorials.blogspot.com/2009/06/niffy-rounded-corners-using-html-and.html

Initial Description
Using the below code,you can have a rounded corner border, to have a rounded fill, please check the url..<a href="http://htmlcsstutorials.blogspot.com/2009/06/niffy-rounded-corners-using-html-and.html">Nifty rounded corners using html and css</a>

Initial Title
Css rounded corners

Initial Tags
css

Initial Language
CSS