How to make a div with rounded corners

html rounded-corners
user23557676 picture user23557676 · Aug 18, 2011 · Viewed 31k times · Source

How do you make a div so that it's border's corners are rounded?

Thanks everyone!

Answer

SilverHorn picture SilverHorn · Aug 18, 2011

Here it is:

<style type="text/css">
div.test
{
width: 115px;
padding: 10px;
border: 2px solid #000;
border-radius: 15px;
-moz-border-radius: 15px;
}
</style>
<div class="test">This is some text!</div>

–SilverHorn

Related questions

CSS3's border-radius property and border-collapse:collapse don't mix. How can I use border-radius to create a collapsed table with rounded corners?

Edit - Original Title: Is there an alternative way to achieve border-collapse:collapse in CSS (in order to have a collapsed, rounded corner table)? Since it turns out that simply getting the table's borders to collapse does not solve the …

Read More
Rounded table corners CSS only

I have searched and searched, but haven't been able to find a solution for my requirement. I have a plain ol' HTML table. I want round corners for it, without using images or JS, i.e. pure CSS only. Like …

Read More
How to make CSS3 rounded corners hide overflow in Chrome/Opera

I need round corners on a parent div to mask content from its childen. overflow: hidden works in simple situations, but breaks in webkit based browsers and Opera when the parent is positioned relatively or absolutely. This works in Firefox …

Read More