Spiffy Corners

Get the Code: CSS

<style type="text/css">
.spiffy{display:block}
.spiffy *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#b20000}
.spiffy1{
  margin-left:3px;
  margin-right:3px;
  padding-left:1px;
  padding-right:1px;
  border-left:1px solid #dd9191;
  border-right:1px solid #dd9191;
  background:#c53f3f}
.spiffy2{
  margin-left:1px;
  margin-right:1px;
  padding-right:1px;
  padding-left:1px;
  border-left:1px solid #f7e5e5;
  border-right:1px solid #f7e5e5;
  background:#c03030}
.spiffy3{
  margin-left:1px;
  margin-right:1px;
  border-left:1px solid #c03030;
  border-right:1px solid #c03030;}
.spiffy4{
  border-left:1px solid #dd9191;
  border-right:1px solid #dd9191}
.spiffy5{
  border-left:1px solid #c53f3f;
  border-right:1px solid #c53f3f}
.spiffyfg{
  background:#b20000}
</style>

Get the Code: HTML

<div>
  <b class="spiffy">
  <b class="spiffy1"><b></b></b>
  <b class="spiffy2"><b></b></b>
  <b class="spiffy3"></b>
  <b class="spiffy4"></b>
  <b class="spiffy5"></b></b>

  <div class="spiffyfg">
    <!-- content goes here -->
  </div>

  <b class="spiffy">
  <b class="spiffy5"></b>
  <b class="spiffy4"></b>
  <b class="spiffy3"></b>
  <b class="spiffy2"><b></b></b>
  <b class="spiffy1"><b></b></b></b>
</div>

Sponsored Links

License:

May be used for personal and business use, but may never be sold or used in a product that is not free without my consent.

If you found this useful, return the favor by linking to us:

<a href= "http://www.spiffycorners.com">Rounded CSS Corners</a>

Questions or Comments?

moc.liamg@nosnhoJ.gerG

Also check out spiffyBOX: