Advanced Search

Css rounded corners

/ Published in: CSS
Save to your folder(s)
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>

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  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;}

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

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.