Rounded corners without images
<div style="width:150px;margin:0 auto;background-color:#0f0;" >
<b style="display:block;background-color:#fff;">
<b style="display: block; height: 1px; overflow: hidden;margin: 0 5px;background-color:#0f0"></b>
<b style="display: block; height: 1px; overflow: hidden;margin: 0 3px;background-color:#0f0"></b>
<b style="display: block; height: 1px; overflow: hidden;margin: 0 2px;background-color:#0f0"></b>
<b style="display: block; overflow: hidden;margin: 0 1px;background-color:#0f0; height: 2px"></b> </b>
<ul><li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li> item 4</li></ul>
<b style="display:block;background-color:#fff;">
<b style="display: block; overflow: hidden;margin: 0 1px;background-color:#0f0; height: 2px;background-color:#0f0"></b>
<b style="display: block; height: 1px; overflow: hidden;margin: 0 2px;background-color:#0f0">
</b> <b style="display: block; height: 1px; overflow: hidden;margin: 0 3px;background-color:#0f0"></b>
<b style="display: block; height: 1px; overflow: hidden;margin: 0 5px;background-color:#0f0"></b> </b></div>
I don't apply css, i think it's simple, and you can easy apply css in place of inline styles. This code is exactly code for above rounded green rectangle.
<b style="display:block;background-color:#fff;">
<b style="display: block; height: 1px; overflow: hidden;margin: 0 5px;background-color:#0f0"></b>
<b style="display: block; height: 1px; overflow: hidden;margin: 0 3px;background-color:#0f0"></b>
<b style="display: block; height: 1px; overflow: hidden;margin: 0 2px;background-color:#0f0"></b>
<b style="display: block; overflow: hidden;margin: 0 1px;background-color:#0f0; height: 2px"></b> </b>
<ul><li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li> item 4</li></ul>
<b style="display:block;background-color:#fff;">
<b style="display: block; overflow: hidden;margin: 0 1px;background-color:#0f0; height: 2px;background-color:#0f0"></b>
<b style="display: block; height: 1px; overflow: hidden;margin: 0 2px;background-color:#0f0">
</b> <b style="display: block; height: 1px; overflow: hidden;margin: 0 3px;background-color:#0f0"></b>
<b style="display: block; height: 1px; overflow: hidden;margin: 0 5px;background-color:#0f0"></b> </b></div>
- item 1
- item 2
- item 3
- item 4
If you're new here, you may want to subscribe to my RSS feed. Thanks for visiting!