| 7:45 am on Jan 26, 2006 (gmt 0)|
IE on the mac doesn't suffer from the box model problem, and therefore doesn't need the hack - this is why you've used a 'hide from ie mac hack' around your IE/win code:
/*\*/ this is hidden from IE mac /**/
| 6:50 pm on Jan 26, 2006 (gmt 0)|
Thanks for the response.
However, I'm a little confused. IE/Mac is not displaying .navigation how I want it to -- it's too narrow because it's not including the 10px left/right padding. Therefore, I would like to force IE/Mac to display .navigation at 190px. I thought the Holly Hack was supposed to do this?
Maybe I've got the syntax backward in my code?
| 8:59 pm on Jan 26, 2006 (gmt 0)|
IE5 Mac definitely gets the box correct. Maybe it follows IE5/Win in quirks mode though? I can't find anything to back that up...
Could you paste the doctype you're using?
| 10:48 pm on Jan 26, 2006 (gmt 0)|
Unfortunately it's definitely not getting it the way I want it at the moment. ;-)
Intuitively it seems to me that IE should be considered to be doing it right: I specify 170px for the box and the 10px left/right padding shouldn't change the size of the box, just push the text inward 10 px from the edges.
Yet I recall reading somewhere that FF's model of determining the box size as width + padding is correct, hence my need for IE/Mac to render the box as 190px.
Anyway, here's the doctype I'm using. I don't know if it's what I should be using though.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Thanks for your help!
| 11:26 pm on Jan 26, 2006 (gmt 0)|
|Intuitively it seems to me that IE should be considered to be doing it right: I specify 170px for the box and the 10px left/right padding shouldn't change the size of the box, just push the text inward 10 px from the edges. |
Is this a wind-up? ;-)
Just kidding--this version of 'intuitive' is often hotly debated here and elsewhere. In any case for reasons best looked into outside of this thread, the Firefox way is the right way, but it's not as simple as that...
You need to look into quirks mode [google.com]. Because IE5 Windows was a very widely used browser, when the much more standards-compliant IE6 came out Microsoft had to provide a way not to break old sites--this method was quirks mode. Briefly put, quirks mode provides a way of emulating IE 5 Win's incorrect behaviour. Other browsers have since built in the same feature for the same reason.
Activating 'standards mode'--in other words, forcing the browser to use the standard box model--in most browsers is simple; you just use a complete doctype [w3.org] (which is not what you're using now...)
Note that this may cause all kinds of havoc at first if you've built a page with an abbreviated doctype like the one that you posted above. It's worth it to do, however, because it makes the coding of webpages much more predictable and controllable.
| 12:22 am on Jan 27, 2006 (gmt 0)|
Thanks so much for the helpful explanation of the doctype/quirks mode issue. And I certainly didn't mean to wind anyone up regarding the intuitiveness of IE vs. FF re: the box model. :)
I copied the XHTML doctype from the page you linked to. However, I'm building a PHP page so the first line of the recommended doctype:
<?xml version="1.0" encoding="utf-8"?>
caused PHP to implode with a parse error (no doubt related to the "<?xml" bit). I removed that line and the page rendered again.
It rendered my .navigation box perfectly in both FF and IE/Mac (I'll have to wait to test IE/Win 6). That's the great news, and thank you for your help.
However, what might I have broken by removing the <?xml line? It seems IE/Mac isn't being thrown into quirks mode because that line is missing (good), but how necessary is that line?
| 12:28 am on Jan 27, 2006 (gmt 0)|
Completely unnecessary. It's needed if you're doing both of the following:
a) Serving XHTML as application/xhtml+xml or application/xml
b) using a character encoding that isn't UTF-8 or UTF-16
You're definitely not doing a) because it's working in IE :) So leave it out.