CSS question. How to add zoom icon?

  • I want to add a zoom icon for lightbox images in posts.

    I added “span” with position absolute using jQuery, it works for all not aligned images:

    <a href="..." rel="lightbox">
<span style="position:absolute; background-image: url(zoom.png);"/>
<img src="img.jpg" class="alignnone"/>
</a>

    But it fails on float images (“alignleft” and “alignright” classes in my theme). How can I position the icon over a floating image? Maybe I need another method?

Viewing 2 replies - 1 through 2 (of 2 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Align Left and Align Right classes use the text-align property, not float.

    Thread Starter Dendroid

    (@dendroid)

    All installed on my blog themes uses float for “alignleft” and “alignright”: my theme, twenty-eleven theme, default wordpress theme.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘CSS question. How to add zoom icon?’ is closed to new replies.