CSS-sprites alternative in html source?

Up vote 1 down vote favorite share g+ share fb share tw.

EDIT: Screenshot from Chrome: html css web-development link|improve this question edited Jan 7 at 23:39 asked Jan 7 at 23:09Alireza Noori914312 94% accept rate.

Set the tag if that helps you at all. Just for kicks, as an alternate solution: You could append your image with a query string that contains the coordinates and size: ...then use . Htaccess to send this request to a server side script that processes the image and outputs the partial image (but that's another topic altogether).

This post might help you with the . Htaccess bit, should you choose to implement it: RewriteRule for image file requests only if a query string is present It really sounds like you want to use CSS sprites, there are a number of tutorials on this, here's one: css-tricks.com/css-sprites.

Thanks. But there's one little problem here, I have a problem like the one in this question. I want to create a search box with a submit button of type image.

When I set the src="", a border will be shown in IE and Chrome (not FF). At the same type I want to put all my images in one big image and use offsets. What should I do?

– Alireza Noori Jan 7 at 23:23 You should not use , it's actually designed for another purpose (like image maps, where the coordinates clicked have importance). Use CSS to style a instead. You can even just toss an into a , or simply style a (but button is more flexible).

You really are asking how to use image sprites. – Madmartigan Jan 7 at 23:28 I'm actually using CSS sprites. I just didn't know the name :D Thanks.

I'll change the title of my question. I've used the border:0 (or none). It will not work if src="".

– Alireza Noori Jan 7 at 23:31 But... using src has nothing to do with sprites.... – Madmartigan Jan 7 at 23:35 I don't know. That's the thing. I think when I set src="" the browser (IE and Chrome) looks for the image and if haven't found, they show an error image or an empty image with borders.

So I have to put something in there. If I slice the image and put the address in the src it will fix it but I want to avoid the HTTP request. – Alireza Noori Jan 7 at 23:38.

Simply put you cant unless you scale the image down or up. Use an outer span with overflow:hidden and set the size of the image on that. Something like span.

Thumb { width:120px; height:70px; overflow: hidden; } Put the image inside this span.

You would probably have to wrap it in a that is smaller than the and then set the offset of the image with top:y; or margin-top: y.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions