I've been searching for a while now, but I can't seem to find a solution to fix this specific issue. On a webpage, I have an image (<img...>) that, when it loads, shows a 1px solid white (or very light grey) outline or border on the outermost edge of the image. It's not surrounding the image, but rather along the outer pixels.
Here is the CSS associated with it:
cursor: pointer;
display: inline-block;
float: left
I have attempted to use:
border: none
border: 0
outline: none
outline: 0
-webkit-border-before: 0px solid #fff
-webkit-border-after: 0px solid #fff
Despite my efforts, I am stuck. The only way I have found to partially eliminate the white line is by increasing the border radius to crop the corners of the image. I have double-checked that the outline is not part of the image itself.
The original image:
The div that holds this image (as well as other similar images that don't have the same issue) has the following CSS properties:
text-align: center;
height: 60px;
display: inline-block;
position: absolute;
width: 270px;
bottom: 0px;
left: 0px;
padding: 0px 20px;