Jump to content

"A Layout Done In Tables" Issue


newseed

Recommended Posts

I have an issue with this site: calt rout.org/index_2009menu.asp (remove 1 space).

 

A brief history:

 

This site was done by someone a few years ago in which they used an incomplete doctype (see below).

 

 

My task was to replicate a dropdown menu which will replace a bulky and slow dhtml menu builder script which is also not seo friendly either. This new css menu works perfectly in all browsers including IE. I used an Conditional Comment for IE6 to render a small script in order for the menu to work.

 

Once I added this to a test page (see link above), the dropdown didn't work in IE. I then realized that the page is rendering in quirks mode thus leading me to believe that there was not a doctype or it was incorrect.

 

I have since inserted a correct doctype and the menu now works perfectly. However, one issue I have is that there is a 1 or 2px gap in the fin just to the left of the menu. I just can't get this issue resolved for whatever reason.

 

This gap issue goes away if in quirks mode but then the menu will not work also. The option is to leave it in quirks mode and change my IE Conditional Comment to allow all IE version to run the script but I really rather not do that.

 

Any suggestions?

Link to comment
Share on other sites

It still shows a thin vertical white line in IE7 between trout1.jpg and trout2.jpg. It's not related to the menu. I found that by switching between IE7 and Firefox, IE7 was moving 1px wider, causing a vertical space to appear.

 

It's related to trout1.jpg. If I made the style .trout1bg repeat instead of no-repeat the space was closed, but of course it repeats the part of the image from the left side onto the right which has the wrong colors. As a quick fix I used Irfanview to cut a 1px wide slice from the right of trout1.jpg and added it to the 140px wide image on the right to make it 141px wide and this worked to cover the 1px wide space in IE7.

 

Don't ask me what's happening because the markup

limits it to a width of 140px but IE must be expanding this for some reason so providing a wider background image fills the space. As it's a background image the wider image has no effect on Firefox.

 

It must be that somewhere in that column you have exceeded 140px, perhaps because of spacers, and IE7 has expanded the whole column.

Edited by Wickham
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...