Firefox & Mac - Page misaligned

  graysmen85 07:05 23 Jul 07
Locked

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).

tia

  graysmen85 12:24 23 Jul 07

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

  Eric10 20:03 23 Jul 07

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 07

Eric10,
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?

Thanks

  Eric10 12:04 25 Jul 07

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;}
</style>
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 07

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 07

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 07

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 07

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.

Samsung Galaxy Book review: Hands-on with Samsung’s high-end hybrid

1995-2015: How technology has changed the world in 20 years

This is probably one of the best bank ads we’ve seen

Apple Watch 2 vs Huawei Watch 2 comparison review: watch out for 4G smartwatches Apple