css - Why does Chrome cause this border / bleed around this image when using translate? -
see fiddle:
https://jsfiddle.net/uy6yhv4d/1/
i have img background-color: red set.
when rendered on page normally, without using transform, appears expected, no red border.
however, when trasform: translate positioning, red background "bleeds" edges, causing red border appear.
why happen?
the red border coming background-color: red;. found removing point values dimensions removed appearance of red border:
img {   height: 256px;   width: 200px;   position: absolute;   left: 50%;   top: 50%;   transform: translate(-50%, -50%);   background-color: red; } 
Comments
Post a Comment