PDA

View Full Version : Why Does My email .png get clipped?


desertpaddler
Dec-09-2009, 11:25 AM
Hi

To prevent bots I'm trying to embed a .png in my bio page that has my, rather long, email address in it.
But no matter what I use for the image tag width/height in the HTML the .png gets clipped on either end and only a few middle letters of the email are displayed. The displayed bit is always the same and just gets bigger or smaller with a change in values for width/height. This happens whether I use .jpeg or .png as the src image.
I'm an HML noob so any help will be great.

Some info:
1. The original png is 1004x100 pixels and should read "CraigR@<websitename>.com"
2. The page is http://www.sunburntandinneedofashave.com/Other/about-me/10360747_9DYDP you can see the distorted and clipped image above the phrase "just click here'
3. My HTML looks like this, the image tag is in bold:

<html>
<div class="myTitle">
... the guy behind the viewfinder
</div> <!-- closes myTitle div -->

<div class="myPhoto">
<img src="/photos/695393391_QPCSK-L-3.jpg" width="178" height="250" />
</div> <!-- closes myPhoto div -->

<div class="myText">
<p>Hi<br /> <br />I'm Craig and I'm generally sunburnt ... and often in need of a shave. <br />
Sometimes a shower would be good too!</p>

<p>I hope you like my images from across the world, made with all sorts of cameras, <br />from my dinky cellphone all the way up to a Pentax 6x7 medium format camera. Yup, I still shoot a fair amount of film.</p>

<p>If you like at least some of what you see come back often, as I'll be updating the images regularly.<br /><br />
You can contact me by email at

<div class="myEmail">
<img src="/photos/736462265_9hR2B-Ti-5.png" width="200" height="20" />
</div> <!-- closes myEmail -->

, just click <a href="javascript:norobotmail('CraigR','sunburntandinneed ofashave.com')">
<span class="myEmail">here</span></a></p>

<p><br />Craig Reynolds<br />Dubai<br /> United Arab Emirates</p>


</div> <!-- closes myText div -->
<div class="spacer"></div>
</html>


I'm really at my wit's end and can't figure this out.

jfriend
Dec-09-2009, 11:37 AM
You were linking to the thumbnail of your email address graphic which is forced to a square shape and truncated. You need to link to the actual image itself instead. Change your email address HTML to this:

</p><div class="myEmail">
<img src="/photos/736462265_9hR2B-M-5.png">
</div> <!-- closes myEmail -->

desertpaddler
Dec-09-2009, 11:42 AM
JFriend, you're such a HERO! :barb

have a cold frosty on me.

BTW, how do I get the image name rather than the thumbnail? I simply did a right-click, save as which gave me the thumbail.

jfriend
Dec-09-2009, 12:02 PM
JFriend, you're such a HERO! :barb

have a cold frosty on me.

BTW, how do I get the image name rather than the thumbnail? I simply did a right-click, save as which gave me the thumbail. Turn on easy sharing and use the Share button to get access to the URLs of all the different image sizes.