Image Replacement With CSS

If you add this little snippet to your CSS stylesheet you can just apply the class name ir to the element for the image replacement styles to take effect.


.ir{
      border: 0;
      font: 0/0 a;
      text-shadow: none;
      color: transparent;
      background-color: transparent;
}

If you want to read more into this new image replacement technique, Nicolas Gallagher has a great post that describes it in great detail – Another CSS Image Replacement Technique

Source: HTML5 Boilerplate

Jake Bresnehan

A Front End Developer based in Sydney and the creator of Web Design Weekly.

Web Design Weekly keeps developers at the forefront of techniques and trends whilst helping them learn and grow to produce top quality code to make the web a better place for all.

This post currently has no responses. What do you think?

You can use basic HTML when posting code, please turn all < characters into &lt; or > into &gt;
If the code is multi-line, use <pre><code></code></pre>

Leave a Reply

Your email address will not be published. Required fields are marked *

Current day month ye@r *