<!-- m --><a class="postlink" href="http://64.232.240.200/new.html">http://64.232.240.200/new.html</a><!-- m -->
This site works well in Mozilla.
There are spacing discrepancies between loads with Mozilla and latest Internet Explorer. The space under headings in the Main section differs between them, and there are gaps in the newsboxes where the background image runs uninterrupted on Mozilla.
Internet Explorer Mac v5 does horrible things as can be seen in this screenshot (<!-- m --><a class="postlink" href="http://64.232.240.200/mac_ie5_screen.jpg">http://64.232.240.200/mac_ie5_screen.jpg</a><!-- m -->). (Colors have been changed slightly since this screenshot was taken, but you get the idea.)
Any help is appreciated.Microsoft Internet Explorer (or "That security hole on most peoples PC" as I like to refer to it as) has a real talent for misinterpreting not just mark up in general but also css. Especially the css box model (<!-- m --><a class="postlink" href="http://www.w3.org/TR/REC-CSS2/box.html">http://www.w3.org/TR/REC-CSS2/box.html</a><!-- m -->) which is very important to the layout of many pages.
Those that really know their stuff with css seem able to write one css file that works the same on all browsers without hacks and still validates. I however am afforded no such luxury and simply have to make a css file for standards compliant browsers and a completely seperate css file just for "That security hole on most peoples PC's" using a browser detection method not too unlike that seen in my signature.This may be caused by not having a full doctype declaration (<!-- m --><a class="postlink" href="http://www.alistapart.com/articles/doctype/">http://www.alistapart.com/articles/doctype/</a><!-- m -->). Also, don't worry about IE5. You would have to use a ton of hacks to get it to look even close to what it's supposed to look like.Thanks for the advice you guys
Well, it not working on IE5 is a problem for me as I need to be able to reach a wide audience with this site. It would also be great experience for future projects where I expect the clients of my clients not to have the latest-greatest (standards compliance falling under greatest but unfortunately latest as well).
Anyone who could provide advice concerning the requisite hacks would be enormously appreciated.Also, here's one with the full DOCTYPE (which wasn't working earlier, hence its incompleteness). Set it up to XHTML 1.0 strict. IE 6 still fudges it up (though it's not as scary as IE 5 of course).
Hacks for both IE 6 and 5 would be spectacular. I know there are a bunch of hacks for hiding CSS and have a number of bookmarks containing tables with them, but I don't know what CSS rules to have hidden from standards compliant browsers in order to fix its brokenness.
Located here. (<!-- m --><a class="postlink" href="http://64.232.240.200/newxhtml.html">http://64.232.240.200/newxhtml.html</a><!-- m -->)terov,
One thing that helped me a lot while trying to get designs look the same in both IE, Mozilla, Opera is to use padding:0 as default and be sure margin somehow also is specified. IE tends to insert both padding and margins when not specified.Virtually every element has both margin and padding defined. Good thing to keep in mind however. Thanks.Originally posted by terov
Virtually every element has both margin and padding defined. Good thing to keep in mind however. Thanks.
The important elements hasn't, like BODY, #container.Excellent point--got caught up in the bottom of my document.
Set them as you suggested and, while there are still the problems I approached the forum with, I imagine it may prevent more from cropping up in the future.Update: Switched the URL back to <!-- m --><a class="postlink" href="http://64.232.240.200/new.html">http://64.232.240.200/new.html</a><!-- m --> since I suppose there isn't much point to having both files.Hm... Well, since IE doesn't understand child selectors,
html>body #foo {mozilla: rules;}
#foo {ie: sucks;} works, and also !important works well for some quick rules #bar {browser: mozilla !important; borswer: ie;} But, for larger amounts of CSS, Server-side browser sniffing is the way to go, so only the code being used is being sent.Can a mod delete this? I double posted.It may not do anything to solve your problem (it may, though
), but you might try removing the quotes from most of your CSS. Quotes are usually only needed when specifying a font family that has a space in the name. Sometimes using it in background URLs can mess things up (I cannot say for sure, but I remember hearing that somewhere).
And the space under the headings may be due to default margin on your paragraph tags. I see you have the vertical padding set to 0 for your P tags within those DIVs, but you might want to try adjusting the margin, too.
Lastly, I just noticed, you have 5px of vertical padding applied to the P tags within your newsbox. Don’t ask me how, but that may have something to do with your IE problem.An odd thing I encountered not long ago was if you defined your padding as anything from 1 to 16 pixels, the padding would always be 16 pixels.
To get anything under 16 px you had to specify 0 which would then give 0.
So I could have either too much or not enough padding. Can't remember which browser though. Threw the code out as a bad job and started over.Originally posted by Mr Herer
An odd thing I encountered not long ago was if you defined your padding as anything from 1 to 16 pixels, the padding would always be 16 pixels.
To get anything under 16 px you had to specify 0 which would then give 0.
So I could have either too much or not enough padding. Can't remember which browser though. Threw the code out as a bad job and started over.
I know what you mean. I have run into the same problem; I get this seemingly default amount of padding/margin/ect. no matter how much I define.
Stupid IE.I think it would help if you snagged the default styles <http://www.w3.org/TR/REC-CSS2/sample.html>, to see if those helped. I use the voice styles, just to show I at least consider the disabled... even if I find it fun to slash wheelchair tires. 
This site works well in Mozilla.
There are spacing discrepancies between loads with Mozilla and latest Internet Explorer. The space under headings in the Main section differs between them, and there are gaps in the newsboxes where the background image runs uninterrupted on Mozilla.
Internet Explorer Mac v5 does horrible things as can be seen in this screenshot (<!-- m --><a class="postlink" href="http://64.232.240.200/mac_ie5_screen.jpg">http://64.232.240.200/mac_ie5_screen.jpg</a><!-- m -->). (Colors have been changed slightly since this screenshot was taken, but you get the idea.)
Any help is appreciated.Microsoft Internet Explorer (or "That security hole on most peoples PC" as I like to refer to it as) has a real talent for misinterpreting not just mark up in general but also css. Especially the css box model (<!-- m --><a class="postlink" href="http://www.w3.org/TR/REC-CSS2/box.html">http://www.w3.org/TR/REC-CSS2/box.html</a><!-- m -->) which is very important to the layout of many pages.
Those that really know their stuff with css seem able to write one css file that works the same on all browsers without hacks and still validates. I however am afforded no such luxury and simply have to make a css file for standards compliant browsers and a completely seperate css file just for "That security hole on most peoples PC's" using a browser detection method not too unlike that seen in my signature.This may be caused by not having a full doctype declaration (<!-- m --><a class="postlink" href="http://www.alistapart.com/articles/doctype/">http://www.alistapart.com/articles/doctype/</a><!-- m -->). Also, don't worry about IE5. You would have to use a ton of hacks to get it to look even close to what it's supposed to look like.Thanks for the advice you guys
Well, it not working on IE5 is a problem for me as I need to be able to reach a wide audience with this site. It would also be great experience for future projects where I expect the clients of my clients not to have the latest-greatest (standards compliance falling under greatest but unfortunately latest as well).
Anyone who could provide advice concerning the requisite hacks would be enormously appreciated.Also, here's one with the full DOCTYPE (which wasn't working earlier, hence its incompleteness). Set it up to XHTML 1.0 strict. IE 6 still fudges it up (though it's not as scary as IE 5 of course).
Hacks for both IE 6 and 5 would be spectacular. I know there are a bunch of hacks for hiding CSS and have a number of bookmarks containing tables with them, but I don't know what CSS rules to have hidden from standards compliant browsers in order to fix its brokenness.
Located here. (<!-- m --><a class="postlink" href="http://64.232.240.200/newxhtml.html">http://64.232.240.200/newxhtml.html</a><!-- m -->)terov,
One thing that helped me a lot while trying to get designs look the same in both IE, Mozilla, Opera is to use padding:0 as default and be sure margin somehow also is specified. IE tends to insert both padding and margins when not specified.Virtually every element has both margin and padding defined. Good thing to keep in mind however. Thanks.Originally posted by terov
Virtually every element has both margin and padding defined. Good thing to keep in mind however. Thanks.
The important elements hasn't, like BODY, #container.
Excellent point--got caught up in the bottom of my document.Set them as you suggested and, while there are still the problems I approached the forum with, I imagine it may prevent more from cropping up in the future.Update: Switched the URL back to <!-- m --><a class="postlink" href="http://64.232.240.200/new.html">http://64.232.240.200/new.html</a><!-- m --> since I suppose there isn't much point to having both files.Hm... Well, since IE doesn't understand child selectors,
html>body #foo {mozilla: rules;}
#foo {ie: sucks;} works, and also !important works well for some quick rules #bar {browser: mozilla !important; borswer: ie;} But, for larger amounts of CSS, Server-side browser sniffing is the way to go, so only the code being used is being sent.Can a mod delete this? I double posted.It may not do anything to solve your problem (it may, though
), but you might try removing the quotes from most of your CSS. Quotes are usually only needed when specifying a font family that has a space in the name. Sometimes using it in background URLs can mess things up (I cannot say for sure, but I remember hearing that somewhere).And the space under the headings may be due to default margin on your paragraph tags. I see you have the vertical padding set to 0 for your P tags within those DIVs, but you might want to try adjusting the margin, too.
Lastly, I just noticed, you have 5px of vertical padding applied to the P tags within your newsbox. Don’t ask me how, but that may have something to do with your IE problem.An odd thing I encountered not long ago was if you defined your padding as anything from 1 to 16 pixels, the padding would always be 16 pixels.
To get anything under 16 px you had to specify 0 which would then give 0.
So I could have either too much or not enough padding. Can't remember which browser though. Threw the code out as a bad job and started over.Originally posted by Mr Herer
An odd thing I encountered not long ago was if you defined your padding as anything from 1 to 16 pixels, the padding would always be 16 pixels.
To get anything under 16 px you had to specify 0 which would then give 0.
So I could have either too much or not enough padding. Can't remember which browser though. Threw the code out as a bad job and started over.
I know what you mean. I have run into the same problem; I get this seemingly default amount of padding/margin/ect. no matter how much I define.
Stupid IE.I think it would help if you snagged the default styles <http://www.w3.org/TR/REC-CSS2/sample.html>, to see if those helped. I use the voice styles, just to show I at least consider the disabled... even if I find it fun to slash wheelchair tires.