A: 

Make them a background image and possibly even combine them in the same transparent PNG. Then just apply the bg image to those elements, specify width/height and overflow hidden possibly to cut it off. Specify a background-position per each, and you should be good.

meder  2010-09-21 00:41:15
I did as you said and made the images background images on the LI's instead and still no good. I'm starting to thinking it's something else on my menu causing the issue.
Dwayne  2010-09-21 01:33:44
A: 

I discovered the cause of this issue and update my question to reflect the answer.

Dwayne  2010-09-23 04:26:27

related questions

IE7 HTML/CSS margin-bottom bug.
IE7: header above menu
How to create an all browser-compatible hanging indent style in CSS in a span
How can you customize the numbers in an ordered list?
style.display not working in Firefox, Opera, Safari - IE7 OK
Best WYSIWYG CSS editor?
How important is W3C XHTML/CSS validation when finalizing work?
Solve the IE select overlap bug
IE8 overflow:auto with max-height
Autosizing Textarea
What is the best way to create rounded corners using CSS?
FF3 WinXP != FF3 Ubuntu - why?
Is there a business reason for striving for pure CSS layout?
How to set up a CSS switcher in ASP.NET
Setting a div's height in HTML with CSS
Wrapping lists into columns
CSS Background Color in Javascript
How can I make the browser see CSS and Javascript changes?
What sites offer free, quality web site design templates?
Can you recommend a good CSS online resource or book?
Html CSS Editor
In HTML, how to word-break on a dash?
Detecting font in JavaScript
How do you test layout design across multiple browsers/OSs?
Why doesn't the percentage width child in absolutely positioned parent work in IE7?