Image strip

[ratcateme]

I am trying to create a html image strip so i load 5 icons on one image and display them separately i have this code form google

<img border="0" style="background: transparent url(http://gwt.google.com/samples/Mail/B9DA8B0768BAD7283674A8E1D92AD03D.cache.png) no-repeat scroll -80px 0px; width: 16px; height: 16px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" src="http://gwt.google.com/samples/Mail/clear.cache.gif"/>

taken from http://gwt.google.com/samples/Mail/Mail.html

i am trying to repeat it on my server i have this

<img border="0" style="background: transparent url(http://10.1.1.253/strip.png) no-repeat scroll -50px 0px; width: 50px; height: 50px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" src="http://gwt.google.com/samples/Mail/clear.cache.gif"/>

all i have changed are the sizes because my strip has 3 colors blocks that are 50px by 50px see the attachment. i am using Firefox i don't know if that is affecting the css Google are generating.

 

any ideas on how to make this work would be great.

 

Scott.

 

[attachment deleted by admin]

[haku]

That code will only work for mozilla browsers (of which firefox is one). It's got mozilla specific CSS in it. This means that even if you get it working, it will never work on IE.

[ratcateme]

i took out the Mozilla only code and got this

<img border="0" style="background: transparent url(http://gwt.google.com/samples/Mail/B9DA8B0768BAD7283674A8E1D92AD03D.cache.png) no-repeat scroll -80px 0px; width: 16px; height: 16px;" src="http://gwt.google.com/samples/Mail/clear.cache.gif"/>

and

<img border="0" style="background: transparent url(http://10.1.1.253/strip.png) no-repeat scroll -50px 0px; width: 50px; height: 50px;" src="http://gwt.google.com/samples/Mail/clear.cache.gif"/>

it works in IE and Firefox but my strip still wont display.

 

Scott.