programAngel Posted March 7, 2012 Share Posted March 7, 2012 if you see the following link in chrome:http://barzilaymor.co.il/diurplus/DiurPlus.phpyou will see in every rectangle, 4 small rectangles in the color blue, orange, green and red.But in firefox you see none of them.I have used CSS Sprite to create them and here is the code: <img src='' class='rectangular-key extra-info-key'/><img src='' class='rectangular-key galley-key'/><img src='' class='rectangular-key contact-key'/><img src='' class='rectangular-key map-key'/> and the css: .rectangular-key{ width: 10px; height: 10px; background:url('image/strip.png');}.extra-info-key{ background-position: -304px -135px; border:0;}.galley-key{ background-position: -304px -152px; border:0;}.contact-key{ background-position: -304px -118px; border:0;}.map-key{ background-position: -304px -169px; border:0;} what is wrong here?After all it is working well for me in IE and chrome, so what should I do in order to make it work for firefox? Link to comment Share on other sites More sharing options...
thescientist Posted March 8, 2012 Share Posted March 8, 2012 just an FYI, that link is literally just an explosion of PHP errors. I can only assume that the FF doesn't like the empty src tag. Maybe just use a dummy image in it's place. I usually just use a 1x1 transparent image. Link to comment Share on other sites More sharing options...
dsonesuk Posted March 8, 2012 Share Posted March 8, 2012 I think you will find its not working because a img element by default is a inline element, you need to make it a block element, but! by making it a block element you may need to use float depending how they are placed. Link to comment Share on other sites More sharing options...
thescientist Posted March 8, 2012 Share Posted March 8, 2012 ah that's it. with no image in the src, it will have no height/width, thus not showing. and the CSS width/height won't apply to an inline element. I always gleam over that fact, doh. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.