What is the best way to crop an image in HTML?

Question

It would be something like the following:

<img src="something.gif" x1="10" y1="10" x2="20" y2="20">

If that doesn't work, then I'll just use GIMP. Any thoughts on how I can get this to work programmatically?

Way to go champ, not only are you harassing users by mass-editing their posts, you're reverting legitimate fixes now! — , Mar 03 '09 at 23:03
@Rich B: I believe he's talking about you. "What is a fastest way" was your rollback from the correct "What is the fastest way". — James B, Mar 03 '09 at 23:30
@James: Yes I am aware. Mistakes happen, and it got fixed. Ant P is just bringing his flamewars to new threads, it is ok. I was working with the OP to get the post all set up. — GEOCHET, Mar 03 '09 at 23:31
@All I originaly asked "a fast way". As i had no clue how to do this. How it is now it's good. Thank you for your willingness to help my questions you even turned it into community wiki. If you all focused more on helping ppl find solutions it would me much better for everyone — fmsf, Mar 03 '09 at 23:34
How it is now it's good == As it is now it's good. Sorry for my bad english. — fmsf, Mar 03 '09 at 23:34
@fmsf: I agree, if we could stop having these rollback wars and let the mods do their jobs, people like you would benefit greatly from better editing in your posts. — GEOCHET, Mar 03 '09 at 23:35
See also http://stackoverflow.com/questions/527336/tools-to-make-css-sprites — ripper234, Oct 30 '11 at 13:19

Georg Schölly · Accepted Answer · 2009-02-06T10:51:50.777

19

That's called sprites, you can read this fantastic article of A List Apart.

In the end it boils down to:

#panel2b {
    width:50px;
    height:30px;
    background: transparent url(test-3.jpg) -96px -200px no-repeat;
}

edited Feb 06 '09 at 10:51

answered Feb 06 '09 at 10:19

Georg Schölly

You need a height & width definition for that panel for it to work. – Ólafur Waage Feb 06 '09 at 10:39
2

Ahhh sprites, reminds me the good days when I painted sprites in C64 with bytes representation... – Itay Moav -Malimovka Mar 03 '09 at 23:29

score 4 · Answer 2 · edited May 23 '17 at 10:27

4

You can also use a tool like this web based CSS Sprite Generator to create a larger image if you have many slices.

[Someone on my similar question led me to yours].

edited May 23 '17 at 10:27

Community

answered Feb 09 '09 at 09:12

Simon_Weaver

2 Answers2