HTML Madness

kits · 10-09-2005

Well its been a long time but im back with a question. Well first glad to see Biorust is still running strong.

Ok now for the question

Im trying to get an image to be a link. I know the code for this process but its seems that when I try using it my page splits. Yes im using Imageready which is the devil but its my personal preference. Here is a link to the website that is currently running with Tables as links which doesnt all ways work as it requires code correction thourgh the browser and ends up just turning most of the links to background images.

[Use veiw page source to veiw code pls thx

]

http://www.ksu.edu/sigep/history.html

Here is what I would like to to have below but with the code i use it splits the page as you can see with the link that I edited:

http://www.ksu.edu/sigep/balanced.html

Any help I cna get to resolve this issue would be so great!

Thanks again,

Stiker

**Man1c M0g** · 10-09-2005

Your problem only appears in Internet Explorer and may be due to its questionable use of the BORDER parameter. Add border="0" to the IMG tags, and the problem will probably vanish...

kits · 10-10-2005

Thanx mog! Always very helpful

(edit) Well I added the code just now and it seems to still not want to stop. I will toy with it a bit more and let you know.

supafly · 10-11-2005

can i ask why they are backgrounds and not images maybe that would help with the tables and such you have done it for the first two maybe that's the thing that is making it wonky

I hope it helps

kits · 10-11-2005

The rest of the site but the one section that I edited are all backgrounds. The one that I edited (/sigep/balanced.html) the home icon is not a background. The whole image was made into a link and it then split the webpage. I have had images as links before and I have not seen this happen which is why I am confused. It adds a 3px bottom border to the link. Unless it is something with my CSS code but i do not see it anywhere.

I also tried putting the "border=0" command in like every line above it hoping that it might get rid of the border but it did not.

kits · 10-12-2005

just bumping it...Stil have not yet figured out why but if anyone might have the solution that would be great <3

**Man1c M0g** · 10-12-2005

Heya Kits! The solution is quite easy when you know about IE's wierd rendering engine. The solution lies with your 'Balanced Man' and 'Home' graphics. Here is some of your original code:

HTML Code:

<TD><IMG height=27 alt="" 
      src="- Sigma Phi Epsilon - Kansas Beta - Balanced Man Information -_files/banner2.gif" 
      width=223 border=0> </TD>

Notice the space right near the end, between the IMG and closing TD tag? In IE that renders as a space and leaves a slight gap after your image. Change the code to something like this:

HTML Code:

<TD><IMG height=27 alt="" 
      src="- Sigma Phi Epsilon - Kansas Beta - Balanced Man Information -_files/banner2.gif" 
      width=223 border=0></TD>

...And the problem vanishes! Here's the corrected HTML file. Enjoy!

kits · 10-13-2005

Always the little things. IE needs to be revamped hard core. Im going to create a enter page with a link to firefox and suggest it being downloaded. Things like that are just annoying but it makes sense I guess. Thanks again Mog for all your help Ill re post when I am finished with the site for a critique for finilization.

Many many thanks

stik

robin746 · 05-02-2006

Man1c M0g: +1 for that.

Everyone else: When in doubt, remove whitespace from your HTML. It's not supposed to be significant, but it sometimes is, and will result in things like:
* banding between images that should be adjacent
* extra line breaks
* content not fitting into containers it should

If you see these symptoms, zap all offending whitespace!

allstar · 05-03-2006

also you will have to put in alt if you check it in W3skools standard as they have it as i must am i not sure why tho

robin746 · 05-03-2006

allstar: The "alt" attribute is there as an "alternative" to the image for those who will not see it because they are blind, have images turned off, are viewing on a text-only interface, etc. You should always provide an "alt" attribute.

The "title" attribute adds additional information to the image, generally seen when you mouse over it. The two are available for different purposes. Some earlier browsers would display the "alt" on a mouse-over, but that was in error.