Layout of website is not flawless in Firefox and Netscappe

[yogalady]

My website looks fine in IE 7, but not in Firefox and Netscape.

I use a DWT, and if I remember correctly, I designed the site with a layout
table with "Corner, Header, Left and Body." I split the body to get two
columns.
I added header, footer and applied corners and shadows.

In Firefox and Netscape, the headers and footers of some pages are not
consistent.

What can I do to make the website look good for all browsers?

Also, I don't know what happened, but when I go back to my DWT, all the
options in the task pane to modify the layout are grayed out and not active.
It looks a if for some reason I cannot do any changes!

I use FP 2003, and the URL is www.developserenity.com

Any ideas are greatly appreciated,
Monika

 

[md Webs Unlimited]

Design with FireFox and Hack IE.

IE is the issue and not FF as FF supports standards whereas IE, esp IE6,
does not.

--
Mike - FrontPage MVP '97 - '02
Expression Tools & Addin
http://www.j-moves.com
http://www.panemanager.com
FrontPage Tools & Addin
http://www.jbots.com
E-Commerce
http://www.candypress.com

 

[yogalady]

Hi Mike,

What do you mean by "design with FireFox?"
How would I do that?

I designed my site with FP 2003, using a layout table. It always looked good
when I previewed it in IE 7 and Netscape 9.

Monika

 

[Murray]

If you are seeing the "correct" layout in IE, and a goofy one in any other
browser, that is almost a guarantee that it's because you have used
IE-proprietary methods. Unfortunately, FP won't prevent you from doing
this. A good way to see if this is the case would be to visit
http://validator.w3.org, and submit your page's URL for validation. If it
fails validation, then that's a tip-off.

For me, validation of pages is *the single* most powerful and revealing
layout debugging tool. I invest no effort in troubleshooting a layout until
all my pages validate (and are rendered in standards mode).

 

[md Webs Unlimited]

Instead of designing with IE always design with FF because if you get it to
display correctly in FF then you know it is standards complaint. Once you
have that then check the design in IE and add hacks for it to display
correctly in IE. Most hacks required for IE are well known and documented.

--
Mike - FrontPage MVP '97 - '02
Expression Tools & Addin
http://www.j-moves.com
http://www.panemanager.com
FrontPage Tools & Addin
http://www.jbots.com
E-Commerce
http://www.candypress.com

 

[Murray]

When Mike says "design with FF", I believe he means to do your previews
using FF, and let that determine how you build your layout. Once your
layout is built and previewing fine in FF (and only then), then correct it
for any layout flaws you might see in IE. If your page validates, then the
number and severity of 'hacks' you might have to use for IE will be minimal.
By the way, I don't hack - I use IE-specific comments.

 

[rfr]

My document VALIDATES with the W3C HTML and CSS validators but does NOT
render properly, LOCALLY, with aany other browser than MSIE.

IF . .and only if I move the same document to the Internet server, then all
browsers will render it .. with a few exceptions.

I remain true to my point. My facts are accurate.

FF, Opera and netscape do not render certain aspects of my pages on my local
PC, but do so on the Internet server. They have problems with finding the
Style sheet, the headers, the footers and other elements.

Possibly this is what you are meaning when you refer to relative addressing.
Dunno.

I try to use addrssing based upon the ROOT because it seems to work well
both on my local PC and on the server ( except for FF, Opera and Netscape).
Examples would be if there were a document in the Dine directory which would
call a style sheet from the ROOT as "/main-1000.css", or this header in the
weather directory document
<div style="z-index:0;background-image:
url('/hdrnew/header_background_image.jpg'); width:1000px; height:128px;">
from which FF, Opera, and Netscape cannot find the background image on my
local PC, but MSIE can. All find it on the server. Duh?The problem is
isolated to my LOCAL PC and the use of FF, Opera and Netscape. It is VALID

 

[rfr]

The problem may have to do with the way my local PC hard disk is
partitioned.

I have one drive that is partioned into C:\, D:\, E:\. F:\, and G:\. There
is another drive K:\ where I keep massive .tiff images. The other drive
letters are assigned to CD, DVD, and external drives.

My webs exist in directories (subwebs) on drive E:\. I originally found this
method allowed me to develop, test, and get it looking good in MSIE BEFORE
publishing it to the server. In recent times, tho, I have become aware that
awhile it looks great in MSIE, it does NOT look ok in Firefox, Opera, or
netscape . . but the problem is likely isolated to my PC and will look ok on
the server.

The HTML coding in the subwebs pulls in images and CSS style sheets from the
ROOT of drive E:\.

It may be that Firefox, Opera and Netscape get confused with the coding
relative to the ROOT, as in "/main_1000.css" and erroneously look for it on
drive C;\ rather than looking for it on drive E:\ .As I mentioned, MSIE has
no such problem finding the ROOT of drive E:\.

Firefox, Opera, and Netscape have trouble rendering even documents that are
in the ROOT of drive E:\, rather than in some subweb. MSIE has no such
problems.

 

[yogalady]

Hi Murray,

I understand now that it's a good idea to check the site's layout first with
FF and then with IE.

Before publishing, however, my site looked okay in Netscape. (I did not
preview it in FF; added FF to the browser list for previewing just now.) It
was only after publishing that I noticed that the headers and footers of some
columns are not displayed properly.
Isn't this a real weak point of FrontPage that you have to publish a site
first before you can be sure that the layout is all right?

I am groping completely in the dark with the term "hack!"
What is a "hack?" How do I “add hacks?â€

I followed your suggestion to validate my site with validator.w3.org.
The validation failed, and it lists 13 errors.

Now, I don't know what I am looking at.
I don’t know what this means, “unable to determine Parse Mode†and “No
doctype found.â€

I guess that all the errors listed refer to the home page.
Four of the errors refer to the marquee of the home page, and I am sure that
I can fix them.
As for the others, I even don’t know where to find them. I can see the line
# in code view, but not the column #.

I don’t know if it is too much to ask you to look at it and help me to
interpret the results of this validation.
Here again the URL: www.developserenity.com
And would fixing these errors ensure that FF and Netscape render my layout
correctly?

Frustrated in New Mexico,
Monika

 

[Jens Peter Karlsen]

First of, Netscape is obsolete and hasn't been developed on for years.
Skip it and use Firefox, IE and perhaps Opera.

See inline

Hi Murray,

I understand now that it's a good idea to check the site's layout first with
FF and then with IE.

Before publishing, however, my site looked okay in Netscape. (I did not
preview it in FF; added FF to the browser list for previewing just now.) It
was only after publishing that I noticed that the headers and footers of some
columns are not displayed properly.
Isn't this a real weak point of FrontPage that you have to publish a site
first before you can be sure that the layout is all right?

If you have anything added serverside then you must Publish to see how
that affects the page. Otherwise previewing in a browser locally will
be fine. FPs builtin preview will NOT be enough.

I am groping completely in the dark with the term "hack!"
What is a "hack?" How do I “add hacks?”

A "hack" is a workaround for things that don't work the same. You just
type the necessary code to use it.
If you have a specific problem just post it and someone will post a
"hack" you can use to solve it.

I followed your suggestion to validate my site with validator.w3.org.
The validation failed, and it lists 13 errors.

Now, I don't know what I am looking at.
I don’t know what this means, “unable to determine Parse Mode” and “No
doctype found.”

Doctypes are explained if you read on, on the error page.

I guess that all the errors listed refer to the home page.
Four of the errors refer to the marquee of the home page, and I am sure that
I can fix them.

marquee is a IE specific tag so to fix it you would need to remove it.

As for the others, I even don’t know where to find them. I can see the line
# in code view, but not the column #.

Look at the status bar to see the cursors current location.

I don’t know if it is too much to ask you to look at it and help me to
interpret the results of this validation.
Here again the URL: www.developserenity.com
And would fixing these errors ensure that FF and Netscape render my layout
correctly?

No, Netscape is much too old now to guarantee that.

The errors listed by line numbers.

1. Read what is said about doctypes on the error page.

19. Type is required it is clearly written in the error how you should
write it.

51. You have used height but that is illegal. Use CSS instead.
In the header you delare this class:
<style type="text/css">.tableStyle1 {
height: 647px;
}

And you change the line:
<table border="0" cellpadding="0" cellspacing="0" width="1055"
height="647">

To:
<table class=tableStyle1 border="0" cellpadding="0" cellspacing="0"
width="1055">

You can also change the other attributes to CSS.

76. FP-Style, FP-Title is inserted by FP there is nothing you can do
about this.

107. Marque and any attributes to it are invalid.

146. FP specific. It is anyway not a good idea to try and tamper with
the statusbar text and most modern browsers will disallow it, so
remove it.

325, 332. Images must have an alt attribute. You set this in
properties for the image.

Regards Jens Peter Karlsen.

 

[Murray]

Don't forget Safari....

 

[yogalady]

Hi Jens Peter,

Thanks a lot for your explanations and for taking the time to look at the
validation errors.
I will follow up and see how far I get.

Monika