<!DOCTYPE html> <html> <head> <title>CSS Backgrounds: Subpixel position center is centered</title> <link rel="author" title="Stephen Chenney" href="mailto:schenney@chromium.org"> <link rel="help" href="https://www.w3.org/TR/css-backgrounds-3/#background-position"> <link rel="match" href="reference/subpixel-position-center-ref.tentative.html"> <style> .first{ outline: 2px solid green; background-image: url("../../css-images/support/swatch-red.png"); background-repeat: no-repeat; background-position: center center; background-size: 38.5px 35px; position: absolute; width: 87.5px; height: 87.5px; left: 43.75px; top: 43.75px; } .second { background-image: url("../resources/green-100.png"); background-repeat: no-repeat; background-position: center center; background-size: 38.5px 35px; position: absolute; width: 140px; height: 140px; left: 17.5px; top: 17.5px; } </style> </head> <body> <div class="first"></div> <div class="second"></div> </body> </html>