Forum Moderators: open
We've noticed over time that some of these image tables seem to randomly "break up", with white spaces appearing between the images. I've gone over the code in the problem areas, comparing them to other templates that have the exact same structure, but simply use some different images in some of the areas (I would say that 80% of the images used are identical). The table variables are all identical, the image variables are all identical, and as I indicated before, this seems to occur randomly, after a Library item refresh or just a simple code tweak elsewhere in the template.
To make things worse, the problem only displays in IE, not in any other browser. I've tested with Netscape, Opera and Mozilla and none of them manifests this problem with the images. This wouldn't be an issue if 98% of our audience weren't on IE.
I've been told by another designer that this sort of behavior is often seen in image maps that have been created in Fireworks. This seems like a vague and really not helpful insight but can anyone else corroborate this? Has anyone else experienced this phenomenon and more importantly, can anyone recommend a fix.
The templates were originally generated in DW4 and we have since migrated to MX. I'm really not much of an HTML expert but I think I've done everything that I can think of to make sure that the code in the broken template is identical to others that don't appear to be so.
Thanks.
I don't like to use "generated" tables and code for the simple table.
Keep <scripts>, <image maps> and other non-essential tags out of tables for display images.
Do you have Eample code of the problem areas?
border="0" cellspacing="0" cellpadding="0"
ncw164x
I've checked for white spaces and found none. As for scripts and image maps, there are instances of both in the midst of the trouble area, but again, they exist in all of the templates but it only seems to create a problem on some, not others. The script basically serves up a rotating image and I've checked the syntax in the script and it doesn't appear to be creating any gaps within the code that it creates either.
I've read another article that seems to allude to the fact that these image tables generated by Fireworks is just trouble, and that you can create the sliced up images with FW but that you should create the actual tables within DW, manually, and insert the images themselves into that tables. At this point, I'm reduced to trying that, but on my first attempt, I seemed to have missed something because I get an imperfect result (the edges seems to be skewed and one of the inserted library items, which wasn't causing a problem in the original template now displays a white border all around). What a royal pain in the you-know-what.
Eventually I got rid of the image map. But that doesn't sound like a good option for you...
I've tried to hunt down random white spaces in the code itself and haven't found any but even if I did, if the white spaces were there in every simgle template, why would they cause this to occur in one but not in any of the others?
If this problem were consistent, I would assume it would be easier to isolate, but I can't seem to find any differences at all between the various templates other than the identifiable ones.
Or for troubleshooting purposes try taking code out of tables.
I was able to fix the problem leaving the Image map and sript code in the table but removing any space between tags forcing it to be on one line.
Hope this helps. I did not do complete testing but I think the problem was an extra space just before the </td>.
For example:
<img>
<img>
This will show up with a gap between the 2 images.
This though:
<img><img>
Will show up porperly. This happens to me a lot using dreamweaver.
In the preferences There is an option for line breaks, You may be able to change this to help avoid that problem.
So to fix your problem try moving all the code on to one line with no returns between tags.
I just actually delete the whole table and rebuild it from scratch and that always fixes the problem. It always seems to be faster than tracking down the problem.
Another hint, you said that you had something like 16 Template files, that a lot. If you use the same header at the top of each template, or even if the header is on just more than one template, it is wiser to make the header a server side include and then including the include on each template. then when you need to change it only once if something fubars, upload the include and your done.
I used to use library files in my templates, made changing the header across 3 templates easy, but i still had to upload EVERY page after the change.
