CODEWITHSUNDEEP
javascriptjqueryhtmlcsscross-browser
Justin
Justin

Reputation: 6559

Content in div overlapping rounded corners.

I am trying to get rounded corners on a table element. Ideally, I would like the rounded corners to show on IE 7-10, Chrome, and Firefox. To do that, I am using JQuery Corner. The problem I am facing is that when I apply the default rounded corner effect to the div that surrounds my table, the table overlaps the borders/corners.

Here a screenshot: border

Why is table going outside of my div?

Upvotes: 0

Views: 610

Answers (1)

Kyle
Kyle

Reputation: 67244

Tables don't accept border-radius as a property.

http://jsfiddle.net/Kyle_/zBE6H/

What you can do is wrap it in a div and give that border radius, while removing the border of the table (or giving the border the same color as the div's background.)

http://jsfiddle.net/Kyle_/zBE6H/1/

Upvotes: 3

Related Questions