Hi all- I'm looking to do something that I'd think has been done many times before, I'm just not finding it...
After all email links on an intranet site we have, we show an envelope icon. Simple enough. <p>This is a topic here If you are looking for help on this, please contact <a href="mailto:bobjo...@thedomain">Bob Jones<img src="emailicon.gif" style="width:10px;height:10px;" /></a></p> I'm doing this with rel="email" and jquery, but this is more of a html question so I posted the html code as rendered... If in the paragraph "Bob" is on the first line and "Jones" is on the second, that's fine, the whole think is linked, including the icon which will be inline, right after "jones" on the second line. The issue occurs when "Jones" is at the end of the first line and there's no more room for the image. This keeps "Bob Jones" on the first line, but moves only the image to the second line, which looks silly. Now, I could surely use "white-space:nowrap" in the <A> style, but that would cause "Bob Jones" to move to the second line, when what I really want is only "Jones" to move to the second line. Is there some "keep-with-previous-word" type of css that i could set on the style of the image? Now, I am using jquery to insert the image, and maybe there's some kind of modification that I can do to only the last word, like adding a div with no wrap... Thanks in advance for you ideas. Ken