Firefox & Mac - Page misaligned

  graysmen85 07:05 23 Jul 2007

We seem to have made a fundemental error whilst attempting our first website construction. click here
It seems to be working very well in IE6, but is distorted in Firefox and with Mac PC's. i.e parts of pages are moved to the left rather than remaining central.
Also, the links will not work at all in the pages.
Can anyone suggest a remedy please, other than starting again?
We have about 500 pages, if it would mean placing code in everyone of these, we will do it (being retired, time is not a problem).


  graysmen85 12:24 23 Jul 2007

Sorry, I should have said that we are using FP2003.

  Eric10 20:03 23 Jul 2007

I've just tried this on one page (BusinessCat.htm) but it seemed to work so it may be worth looking into. You have your <a href...> tags outside of their appropriate <td> tags and that seems to be causing the problem. If you move them inside the <td> tags it seems to work in Firefox. I can't help you with Macintosh code but if you are lucky it could cure that also.

e.g. existing code:
<a target="Fr02" href="../CategoryDetails/Accountants.htm">
<td style="border-left: 1px solid #FFFFFF; border-right: 1px solid #4B7D2D; cursor:hand;"> Accountants</td></a>

change to:
<td style="border-left: 1px solid #FFFFFF; border-right: 1px solid #4B7D2D; cursor:hand;">
<a target="Fr02" href="../CategoryDetails/Accountants.htm"> Accountants</a></td>

Good luck.

  graysmen85 07:06 25 Jul 2007

Thank you for your time and effort.
We have spent days trying to sort this out.
Your advice does indeed work perfectly for Firefox, we have not tried it with a Mac yet.

One small problem, in IE when we hover over "Accounts" and "Business Support" (The only two categories we have changed so far)they now flicker?

Would you have any further advice please?


  Eric10 12:04 25 Jul 2007

Not an easy one. I think it is safe to say that FrontPage writes web sites that favour IE.
By moving the <a> tags inside the <td> tags the link has been reduced to the actual text instead of the full button. In addition to this the text changes from Titlecase to Uppercase when hovered on. It is this quite noticable change that gives the impression of flicker. If you copy the 'A hover' style from the head section of Business.html
<style fprolloverstyle>A:hover {color: #FF0000;}
into the head section of BusinessCat.html then the text changes case when the button is hovered on even though the link isn't active until the cursor touches the text but as this only gives a colour change the flicker effect is minimal.
Since you are effectively loosing the whole button as a link the question then becomes "Is the cure any better than the original problem?".

  Eric10 20:32 25 Jul 2007

To make the whole button behave as a link:

Add a class to the Subndets.css stylesheet -
.block { width: 248px; display: block; }

Now call it in the <a> tag with <a class="block" href=...>

Adjust the width for best fit in the <td>.

  Eric10 18:17 26 Jul 2007

I have re-worked your buttons in CSS so that you can get rid of the table on your page, which is where your problem seems to be coming from. There is too much explanation for me to list it all on the forum but if you are interested in this approach then email me from the envelope by my name and I will send you a zip file with a sample of your page with the new buttons in place.

  graysmen85 20:40 26 Jul 2007

Thanks for all the time and effort Eric... Very much appreciated. I will try your suggestions and will definately be emailing you shortly. We were half way through building our site before we knew anything at all about css so any new knowledge would be good knowledge.. Thanks again.

  graysmen85 07:24 18 Aug 2007

I thought that I should update this thread.

On advice given here, I am changing every page in the our Main Index, and although things are
coming along very slowly, I am delighted with the results.
The pages that I have changed as suggested, work fine with FireFox and Mac.

I am doing this elsewhere to avoid any further errors, and will upload on completion..
I will leave this thread open a little longer??

I cannot thank you enough.

This thread is now locked and can not be replied to.

Elsewhere on IDG sites

Dell XPS 13 9370 (2018) review

Creative studio Omnibus' brand identity for We Said Enough fights back against sexual misconduct

WWDC history: Apple's product launches since 2005

Espace de stockage : comment libérer de la mémoire sur votre iPhone ?