Hi Trevor,
I read that it is not IE6 but that Firefox accepts it (which it does - the
JS Console gives no error)
What you read is not necessarily reliable, depending upon where you read it!
I rely on authoritative references, including the W3C specifications, and
each browser vendor's own references. I have compiled quite a few of these,
most of which are in my Favorites, and some of which I keep in my memory
(from familiarity). For your convenience, let me share a few of them with
you:
For Internet Explorer-specific, and some standard and general HTML,
JavaScript, and CSS references (the difference is documented in the
documentation):
http://msdn.microsoft.com/workshop/author/dhtml/reference/dhtml_reference_entry.asp?frame=true
For FireFox-specific HTML/CSS/JavaScript reference, which is all standard
excepting some JavaScript, for which there is not yet a standard in many
cases (the W3C is playing catch-up, but the browser vendors cooperate in
many cases):
http://www.mozilla.org/docs/dom/domref/dom_shortTOC.html
http://devedge-temp.mozilla.org/library/manuals/2000/javascript/1.3/guide/
For W3C standards (all):
http://www.w3.org/
For W3C HTML standards:
(HTML 4.01):
http://www.w3.org/TR/html4/
http://www.w3.org/TR/2003/REC-DOM-Level-2-HTML-20030109/html.html
http://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407/
For W3C CSS standards:
http://www.w3.org/TR/REC-CSS1-961217.html
http://www.w3.org/TR/REC-CSS2/
http://www.w3.org/TR/REC-CSS2/propidx.html
Generally, FireFox and Mozilla browsers now adhere to the standards, with
the exception of JavaScript, for which there are not yet standards available
for all functionality. But where there are, FireFox and Mozilla browsers do
follow them. IE6 is pretty bad with regards to standards, but still supports
quite a few. Much of the Microsoft JavaScript spec has been adopted by the
Mozilla family (where there is no existing W3C standard), and much of the
original Netscape JavaScript is supported by IE as well. CSS is where
Microsoft chiefly drops the ball, esp. with regards to margins and padding.
There are others as well, such as "fixed" positioning, etc., but IE supports
the node model well. IE 7 is purported to support almost all CSS standards,
with the promise that at some future time it will support all of them (time
constraints are blamed for any present absences).
I have found that the following methodolgy works well for me:
1. Look to the standard. If IE and FireFox both support it, use it. The
reason for this is that having a "standard first" methodology is more likely
to not need tweaking in the future.
2. If IE does not support the standard:
A. Look for some workaround method that works in both platforms, or
B. Use conditional JavaScript and browser detection
The Microsoft JavaScript reference is the best organized, so when it comes
to JavaScript, I will often start there, and then verify it against Mozilla.
It's just quicker that way, as the Mozilla and Netscape JavaScript
references are not as well organized.
If you have Visual Studio 2005, it has an excellent CSS IDE. It uses DTDs
for intellisense, which enables it to identify errors accurately. Of course,
there are other third-party CSS editors that work much better.
The problem about height:100% is that it interprets this as 100% of the
depth of the contents of the "right" <div>. I don't know why
Get rid of the absolute positioning in the right div. I'm not sure, but due
to the top div, it may be necessary to enclose both of these bottom divs in
a container div to make this work right.
What I would like to do is write some JS which finds the height of all
divs, add sets the "wrap" <div> to the appropriate height,
i.e. height of "wrap" = height of "header" + height of "right"
While this would work, I feel that it is best to avoid using JavaScript for
this sort of thing, if you can do it with CSS and HTML alone. I think of
this sort of solution as a "last resort" or a workaround.
2. I have used the Javascript Console, but I can't resolve all errrors
That's pretty typical. It's not always necessary, but does give you some
things to have a look at.
CSS errors are often caused by elements using styles that are not "legal"
for those elements to use.
But Firefox is not reading the correct file
Instead of:
file:///C:/Documents%20and%20Settings/Trevor/My%20Documents/My%20Webs/newweb/scripts/external.js
it is reading:
file:///C:/Documents%20and%20Settings/Trevor/My%20Documents/My%20Webs/myweb/scripts/external.js
This makes life difficult
Could be a caching issue. Try emptying the browser cache.
Gotta run for now!
--
HTH,
Kevin Spencer
Microsoft MVP
..Net Developer
Who is Mighty Abbott?
A twin turret scalawag.