Rounded Corner Generator
This generator will create rounded corners in CSS that you can use in your DIV Containers.
For rounded corners using CSS properties, goto our CSS3 Rounded Corner Generator.
Rounded Corner Example
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
CSS Code
#rnd_container {background: #DFD5B9; margin:1px;} .rnd_top, .rnd_bottom {display:block; background:#DFD5B9; font-size:1px;} .rnd_b1, .rnd_b2, .rnd_b3, .rnd_b4 {display:block; overflow:hidden;} .rnd_b1, .rnd_b2, .rnd_b3 {height:1px;} .rnd_b2, .rnd_b3, .rnd_b4 {background:#FFFFFF; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC;} .rnd_b1 {margin:0 5px; background:#CCCCCC;} .rnd_b2 {margin:0 3px; border-width:0 2px;} .rnd_b3 {margin:0 2px;} .rnd_b4 {height:2px; margin:0 1px;} .rnd_content { display:block; border:0 solid #CCCCCC; border-width:0 1px; padding: 4px; background:#FFFFFF; color:#000000; }
HTML Code
<div id="rnd_container"> <b class="rnd_top"><b class="rnd_b1"></b><b class="rnd_b2"></b><b class="rnd_b3"></b><b class="rnd_b4"></b></b> <div class="rnd_content"> Your Text Goes Here </div> <b class="rnd_bottom"><b class="rnd_b4"></b><b class="rnd_b3"></b><b class="rnd_b2"></b><b class="rnd_b1"></b></b> </div>