advanced code snippet search

We Recommend

CSS: The Definitive Guide CSS: The Definitive Guide
Provides you with a comprehensive guide to CSS implementation, along with a thorough review of all aspects of CSS 2.1. Updated to cover Internet Explorer 7, Microsoft's vastly improved browser, this new edition includes content on positioning, text wrapping (nowrap), lists and generated content, table layout, user interface, paged media, and more.

Posted By

webdevelopertut on 06/29/09


Tagged

css corners ROUNDED nifty


Versions (?)


Who likes this?

1 person has 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

Embed | Plain TextExpand 
  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.