Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
As can be seen on this demo, in which a table is set with round corners (specifically the top-right and bottom-left), those corners are breached by their contained cell’s background color.
I tried applying some padding to the table, but that didn’t help. Is my only option to add an extra column and row and set their background-color to transparent?
How to fix this using CSS only (no added images or javascript)?
Add
overflow: hidden;to the table’s CSS rule to clip its inner content. The MDN reference states that:As tables are considered block level elements, this rule applies.
To overcome inconsistencies with Gecko driven browsers (e.g. Firefox), apply
display: inline-blockas well.See the updated demo on jsFiddle.