MatthieuGD MatthieuGD - 1 year ago 102
HTML Question

Span Overlay Element Bad Position

On my website ( I have this overlay on the image. But the icon is not correctly aligned, as you can see here:

current problem

It's a Wordpress-based blog with a theme and if I look at the preview of the theme ( the element is correctly positioned:

enter image description here

I have compared the html and css and they seem identical to me. The markup use a span with a pseudo before element to render the icon. I can't find the source of the problem.

Here's the code:

<div class="post-thumbnail">
<a href="" rel="bookmark">
<img width="310" height="165" src="" class="attachment-tie-medium size-tie-medium wp-post-image" alt="Photo: Didier Moïse">

Answer Source

Set display: inline; for that <span> element.