mirror of
https://github.com/mozilla/gecko-dev.git
synced 2025-11-10 21:28:04 +02:00
74905749c6
Automatic update from web-platform-tests Fix background centering with border radius Optimized background painting uses the border clip rect when there are rounded corner, but this rect is not the inner border rect when we are doing bleed avoidance. In such cases anything relying on background position will paint the image in the wrong place (offset by half the border thickness). This patch disables optimized backgrounds when employing bleed avoidance by dest rect shrinkage. It also enables the optimization when there are no images and adds a TODO regarding dest rect adjustemnt in the no-repeat background case. Bug: 919197 Change-Id: I5b9f4f512bc52a33d0b74d25e3f015e5dd8ff58c Reviewed-on: https://chromium-review.googlesource.com/c/1403614 Commit-Queue: Stephen Chenney <schenney@chromium.org> Reviewed-by: Florin Malita <fmalita@chromium.org> Cr-Commit-Position: refs/heads/master@{#621356} -- wpt-commits: e2ac2e7d7539c4eb9963b7f23dbb3f7692fce537 wpt-pr: 14777
24 lines
665 B
HTML
24 lines
665 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>CSS Background Test: Centered background image with border radius</title>
|
|
<link rel="author" title="schenney" href="mailto:schenney@chromium.org">
|
|
<link rel="help" href="http://www.w3.org/TR/css3-background">
|
|
<link rel="match" href="reference/background-image-centered-with-border-radius-ref.html">
|
|
<style>
|
|
span {
|
|
background: url(support/green-60x60-red-5px-border.png) no-repeat center;
|
|
border: 5px solid green;
|
|
border-radius: 5px;
|
|
box-sizing: border-box;
|
|
display: inline-block;
|
|
height: 60px;
|
|
width: 60px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<span></span>
|
|
</body>
|
|
</html>
|