# Using images in navigation (standards compliance)

**URL:** <https://forum.kirupa.com/t/using-images-in-navigation-standards-compliance/281555>\
**Category:** web dev\
**Created:** [February 10, 2009, 5:20pm UTC](https://forum.kirupa.com/t/using-images-in-navigation-standards-compliance/281555 "2009-02-10T17:20:48Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![digitalmatt](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/digitalmatt/32/694_2.png) [@digitalmatt](https://forum.kirupa.com/u/digitalmatt)\
**Post date:** [February 10, 2009, 5:20pm UTC](https://forum.kirupa.com/t/using-images-in-navigation-standards-compliance/281555/1 "2009-02-10T17:20:48Z")

</div>

So, unfortunately our designers want to use images to maintain font consistency across all browsers. I have no say in this. To be compliant in the past what I’ve normally done is set the navigation item background-image to the image of the text and give each item a class to control width/height and hover states. and then use a span tag with the actual text in it and set that span to display:none.

I’ve also used one giant image sprite instead of slicing many images.

But, how do I account for users that turn images off in their browser?

Anyone know a solution for this that covers all bases?