You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
<meta name="assert" content="Backgrounds clipped to the padding box should follow the padding box curve, which should be equal to the outer border radius minus the corresponding border thickness." />
<style>
div {
position: absolute;
}
.container {
position: relative;
width: 140px;
height: 140px;
margin: 10px;
}
.ref {
top: 10px;
left: 10px;
height: 140px;
width: 140px;
border-radius: 30px;
}
.test {
width: 100px;
height: 100px;
padding: 20px;
border: 10px solid transparent;
border-radius: 40px;
background-clip: padding-box;
}
.behind {
background-color: red;
}
.top {
background-color: green;
}
.ref.top {
width: 144px;
height: 144px;
left: 8px;
top: 8px;
}
.test.top {
width: 104px;
height: 104px;
left: -2px;
top: -2px;
}
</style>
</head>
<body>
<p>Test passes if there are two filled green rounded squares and <strong>no red</strong>.</p>