Posted By

webdevelopertut on 06/29/09


Tagged

css corners ROUNDED nifty


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

myrebel420


Css rounded corners


 / Published in: CSS
 

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

Using the below code,you can have a rounded corner border, to have a rounded fill, please check the url..Nifty rounded corners using html and css

  1. HTML Code:
  2.  
  3. <b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b>
  4. <div class="contentb">
  5. <div>Round Border!!</div>
  6. </div>
  7. <b class="b4"></b><b class="b3"></b><b class="b2"></b><b class="b1"></b>
  8.  
  9. CSS Code:
  10. .b1, .b2, .b3, .b4{font-size:1px; overflow:hidden; display:block;}
  11. .b1 {height:1px; background:#888; margin:0 5px;}
  12. .b2 {height:1px; background:#fff; border-right:2px solid #888; border-left:2px solid #888; margin:0 3px;}
  13. .b3 {height:1px; background:#fff; border-right:1px solid #888; border-left:1px solid #888; margin:0 2px;}
  14. .b4 {height:2px; background:#fff; border-right:1px solid #888; border-left:1px solid #888; margin:0 1px;}
  15. .contentb {background: #fff; border-right:1px solid #888; border-left:1px solid #888;}
  16. .contentb div {margin-left: 5px;}

Report this snippet  

You need to login to post a comment.