Image Codes Help

[Pastor Langley]

Help on understanding why one image has "outline or box around it" while the other does not? Code in the Example 2 has extra line. Is this what makes this line around the image, or the box outline? My only guess. Thanks anyone.
NOTE: made a copy of entry and ran "Style and Format Cleaner" - it leaves the box as well and all codes as is below, just makes images bigger of course..
Example without outline 1:
<P>
<P><IMG src="file:///{ModuleAssets}/A9880ECA_JosephTimeline.png"width="60%">
<P>
<P><A href="file:///{ModuleAssets}/A9880ECA_JosephTimeline.png">Click to enlarge</A>

Example with outline 2:

<P>
<P><B>Joseph’s life – family tree</B>
<P>
<P><A href="file:///{ModuleAssets}/D6B1B504_JosephFamilyTree1726x960.png">
<IMG src="file:///{ModuleAssets}/D6B1B504_JosephFamilyTree1726x960.png"width="65%"></A>
<P>
<P><A href="file:///{ModuleAssets}/D6B1B504_JosephFamilyTree1726x960.png">Click to enlarge</A>

 

[Pastor Langley]

I am now going to experiment and see if this is a new find for me at least. Going to make image Example 1 same as 2 and see what happens.
It did it. By adding this "extra" line of code it places a box or outline around the image. Did not know this.

 

[Pastor Langley]

Ok what it does is simply make the "image" a link. Which is good to know too. Sorry to get excited but I learned something.
. Loving SwordSearcher trying to love code...

 

[Pastor Langley]

Try adding border=0 to the image line before or after the width comment, but within the <a href> and </a> tags.

Thank you so much! Will do.

 

[Pastor Langley]

Tried that nothing happens.

 

[marty]

Tried that nothing happens.

Yes - sorry about that. I tried to reply to you to say it wouldn't work after all, but I messed that up as well. It may be something to do with the .png format - I tried adding a border to a png image in one of my modules, but it didn't appear.

 

[Pastor Langley]

Yes - sorry about that. I tried to reply to you to say it wouldn't work after all, but I messed that up as well. It may be something to do with the .png format - I tried adding a border to a png image in one of my modules, but it didn't appear.

It works, may leave it. There must be many codes that do same thing. That said, if you find another by all means send along.

 

[Brandon Staggs]

The blue border is because there is a link on the image.

You can prevent it with some inline css styling.

<a href="https://example.com">
  <img src="image.png" style="border:none; outline:none;">
</a>

 

[Pastor Langley]

Thanks ! I will do both and choose.
YES that works better. Used this part of code: <img src="image.png" style="border:none; outline:none;">
Thanks Brandon.

 

[Pastor Langley]

Final works perfect. Glad to get this worked out. Thanks for the help.
<P align=center><A
href="file:///{ModuleAssets}/JosephTimeline.png"><IMG
src="file:///{ModuleAssets}/JosephTimeline.png"
width="50%"<img src="image.png" style="border:none; outline:none;"></A><BR><FONT size=3>Click Image to Enlarge</FONT>
</P>
No border and when "clicked" enlarges image. Better than having that extra line of code.

 

[Pastor Langley]

All still working. I do not plan to ever become a "coder" "geek" or "programmer" whew...!
Here is what it changes too after edit and closes and reopen editor. Fine with me, was surprised that it changed.
<P align=center><A
href="file:///{ModuleAssets}/JosephTimeline.png"><FONT
size=5><IMG
style="BORDER-TOP: medium none; BORDER-RIGHT: medium none; BORDER-BOTTOM: medium none; OUTLINE-WIDTH: medium; OUTLINE-STYLE: none; BORDER-LEFT: medium none; OUTLINE-COLOR: invert"
src="file:///{ModuleAssets}/JosephTimeline.png"
width="50%" <img></FONT></A><BR><FONT size=5>Click Image to Enlarge </FONT></P>