Re: [css-d] Train wreck in IE6
On Sun, 7 Feb 2010, Kym Costanzo wrote: On Sun, 7 Feb 2010, Kym Costanzo wrote: Could you be more specific about the HTML errors? I did validate the HTML, but the only errors I got were regarding the drop-down menu that I am asking for help with. I can't fix those, as I don't know what I can do differently with that menu. The validation errors have to do with the IE6 hack. Again the menu was one I got from a resource site. If you feel that I need to find a new menu, say so. (sure, coding my own would be better. I'm working on learning how to do that but just not there yet.) There were 12 errors at validator.w3.org. Regarding your question about making the page too small for you to read, I am open to any teaching you wish to offer. As I learned CSS, I read over and over that the right way to size fonts is to set the page font size to 62.5% and then increase using ems. I am using a browser resolution of 1280x1024 and the font size I am using is 1.4em, which I felt was a suitable size, and to me, looks comparable to fonts on other sites I see. But if this is not the right way to do it, I'm open to hearing what is. When I was learning CSS I read over and over that setting the font size to 62.5% was not only wrong, but the technique was thoroughly ridiculed. The correct size is 100%, i.e., the user's preferred font size. -- Chris F.A. Johnson http://cfajohnson.com === Author: Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress) Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress) __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
-Original Message- From: Chris F.A. Johnson [mailto:ch...@cfajohnson.com] There were 12 errors at validator.w3.org. I conceded that - when I posted my initial question, I ~did~ state there were validation errors. But if you'd looked at all 12 of them, every one of them was related to the navigation menu, which was exactly the reason I was posting here. I did not know ~what~ was wrong, what was causing the validation issues. I was asking for help. Paul's response about the improper syntax was the issue (though, unfortunately, fixing that caused the menu to die in Firefox). Regarding your question about making the page too small for you to read, I am open to any teaching you wish to offer. As I learned CSS, I read over and over that the right way to size fonts is to set the page font size to 62.5% and then increase using ems. When I was learning CSS I read over and over that setting the font size to 62.5% was not only wrong, but the technique was thoroughly ridiculed. The correct size is 100%, i.e., the user's preferred font size. Well then I suppose I've been ridiculed. Again, I'm here to learn. And I ~thought~ that was the right way to do it. I do the best I can learning, I'm trying very hard to learn the standards and produce the best sites that I can. Of course I know that you can't believe everything you read on the internet, but I'd seen more than a few tutorials that showed how to size fonts this way. I will go back and read more about it and learn the right way. I'm sorry if my posting was rather a nuisance - I have found this list to be very informative and appreciate any help that I can get. Kym __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
On 2010/02/07 01:09 (GMT-0500) Kym Costanzo composed: Regarding your question about making the page too small for you to read, I am open to any teaching you wish to offer. As I learned CSS, I read over and over that the right way to size fonts is to set the page font size to 62.5% and then increase using ems. That insanity seems to have originated at http://www.clagnut.com/blog/348/ http://www.bergamotus.ws/misc/sensible-css-text-sizing.html and http://fm.no-ip.com/SS/Clagnut/bbcnSS.html describe that method's impact. I am using a browser resolution of 1280x1024 Resolution is irrelevant to anything unless right along with it is known the size of the display. Combined they result is what is variously called PPI or DPI, which is a measure of screen pixel density. The higher the DPI, the more pixels are required to make text legible or an image large enough to show adequate detail. For example, your 1280x1024 on a 15 display is 109 DPI, on 17 96 DPI, and on 19 86 DPI. http://fm.no-ip.com/auth/dpi.xhtml and the font size I am using is 1.4em, If you were using 1em you would be using 100% of the size the visitor has determined, passively or actively, is most appropriate for the bulk of web page text. which I felt was a suitable size, and to me, looks comparable to fonts on other sites I see. But if this is not the right way to do it, I'm open to hearing what is. Going by what other sites do while seeming sensible is not. Most sites are styled in an obsolete tradition originated more than a decade ago when average display resolution was quite a bit lower than it is now, with a lot less variation in DPI then compared to now that we have pocket devices in wide use along with big HDTVs as display screens. It's only right sized when it looks right when the predominant size is the browser default. It's up to users to change their brower defaults if they find them to be inappropriate, in spite of the nearly universal designer assumption that users don't know how to do that. http://fm.no-ip.com/auth/defaultsize.html -- Our Constitution was made only for a moral and religious people. It is wholly inadequate to the government of any other. John Adams, 2nd US President Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://fm.no-ip.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
On 2010/02/07 03:50 (GMT-0500) Felix Miata composed: Resolution is irrelevant to anything unless right along with it is known the size of the display. Combined they result is what is variously called PPI or DPI, which is a measure of screen pixel density. The higher the DPI, the more pixels are required to make text legible or an image large enough to show adequate detail. For example, your 1280x1024 on a 15 display is 109 DPI, on 17 96 DPI, and on 19 86 DPI. http://fm.no-ip.com/auth/dpi.xhtml It's late and I failed to finish the example before sending. On the 17 display above, it takes 16px to make a 12pt (nominally .166 tall) font. On the 15 that same 16px makes only a 10.6pt (nominally .146 tall) font, while on the 19 a 13.4pt (nominally .186 tall). That's a 27% taller text on the 19 compared to the 15. You don't know whether the 19 user chose that size because he wants bigger stuff, or more small stuff, or some mixture of the two. Likewise you don't know whether the 15 user had a choice, or whether he's happy with it, or already complains things are too small. So, you should not be second guessing what size is right for them, or the 17 1280x1024 users, or the handheld users, or the HDTV users, or any of the others, and instead defer to whatever sizes are set as their browsers' defaults for web page main body text. And all you need to do to achieve that via CSS is nothing at all! As long as your IE 6 user base is not a priority, the only sizing that you need to apply is on text that you believe needs to differ in size from main body text, such as footers, headers, superscripts, subscripts, etc. If old IE version users matter, then one little addition covers them too, confirming the browser default setting by applying a font-size of 100% on either the HTML or the BODY element. -- Our Constitution was made only for a moral and religious people. It is wholly inadequate to the government of any other. John Adams, 2nd US President Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://fm.no-ip.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
On 07-Feb-10 03:50, Felix Miata wrote: On 2010/02/07 01:09 (GMT-0500) Kym Costanzo composed: Regarding your question about making the page too small for you to read, I am open to any teaching you wish to offer. As I learned CSS, I read over and over that the right way to size fonts is to set the page font size to 62.5% and then increase using ems. That insanity seems to have originated at http://www.clagnut.com/blog/348/ http://www.bergamotus.ws/misc/sensible-css-text-sizing.html and http://fm.no-ip.com/SS/Clagnut/bbcnSS.html describe that method's impact. I'm at a bit of a loss, to see the difference between * {font-size: 100%;} body {font: 0.84em;} and * {font-size: 84%;} body {font: 1em;} When you start doing measurements at different dpi values, aren't you going to see about the same changes either way? Reese __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
On Sun, 7 Feb 2010, Reese wrote: On 07-Feb-10 03:50, Felix Miata wrote: On 2010/02/07 01:09 (GMT-0500) Kym Costanzo composed: Regarding your question about making the page too small for you to read, I am open to any teaching you wish to offer. As I learned CSS, I read over and over that the right way to size fonts is to set the page font size to 62.5% and then increase using ems. That insanity seems to have originated at http://www.clagnut.com/blog/348/ http://www.bergamotus.ws/misc/sensible-css-text-sizing.html and http://fm.no-ip.com/SS/Clagnut/bbcnSS.html describe that method's impact. I'm at a bit of a loss, to see the difference between * {font-size: 100%;} body {font: 0.84em;} and * {font-size: 84%;} body {font: 1em;} I'm at a bit of a loss to see why you would consider using either of them. When you start doing measurements at different dpi values, aren't you going to see about the same changes either way? -- Chris F.A. Johnson http://cfajohnson.com === Author: Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress) Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress) __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
On 07-Feb-10 20:31, Chris F.A. Johnson wrote: I'm at a bit of a loss, to see the difference between * {font-size: 100%;} body {font: 0.84em;} and * {font-size: 84%;} body {font: 1em;} I'm at a bit of a loss to see why you would consider using either of them. I'm not using either one of those, but someone noteworthy on this list is using one of them. What I'm saying is, I don't see what the difference would be at different dpi values, which was the brunt of the argument against the practice in the links Felix posted. Reese __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
Reese wrote: On 07-Feb-10 20:31, Chris F.A. Johnson wrote: I'm at a bit of a loss, to see the difference between * {font-size: 100%;} body {font: 0.84em;} and * {font-size: 84%;} body {font: 1em;} I'm at a bit of a loss to see why you would consider using either of them. I'm not using either one of those, but someone noteworthy on this list is using one of them. What I'm saying is, I don't see what the difference would be at different dpi values, which was the brunt of the argument against the practice in the links Felix posted. Reese For starters neither of the above is valid CSS. ~d -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
On 07-Feb-10 20:58, David Laakso wrote: For starters neither of the above is valid CSS. Right, I got in a hurry when stripping out unrelated stuph. How about this? * {font-size: 100%; padding: 0; margin: 0;} body {font: 0.84em/1.333 Arial, sans-serif;} * {font-size: 84%; padding: 0; margin: 0;} body {font: 1em/1.33em Arial, sans-serif;} Reese __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
Reese wrote: On 07-Feb-10 20:58, David Laakso wrote: For starters neither of the above is valid CSS. Right, I got in a hurry when stripping out unrelated stuph. How about this? * {font-size: 100%; padding: 0; margin: 0;} body {font: 0.84em/1.333 Arial, sans-serif;} * {font-size: 84%; padding: 0; margin: 0;} body {font: 1em/1.33em Arial, sans-serif;} Reese OK. I understand. Three studies offered without prejudice. http://chelseacreekstudio.com/ca/cssd/test17/index.html Best, ~d -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
On 2010/02/07 20:49 (GMT-0500) Reese composed: I don't see what the difference would be at different dpi values, which was the brunt of the argument against the practice in the links Felix posted. You apparently missed the main point of http://fm.no-ip.com/SS/Clagnut/bbcnSS.html entirely. It contains no discussion of DPI. http://www.gunlaug.no/contents/wd_1_03_04.html which I forgot to include originally discusses the same topic more extensively. My later discussion of DPI was part of explaining why anything other than 100%/medium/1em, either explicitly or via cascade, on things like html, body, p, #body, #content, #maintext and the like is irrational, not to mention rude. The Clagnut sizing method, in addition to being rude, generally causes much very unnecessary CSS complexity, which means it takes stylists using it much longer to get their style troubleshooting jobs done. -- Our Constitution was made only for a moral and religious people. It is wholly inadequate to the government of any other. John Adams, 2nd US President Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://fm.no-ip.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
On Sun, 7 Feb 2010, Kym Costanzo wrote: I've got a train wreck in IE6, so bad that my attempts to fix this are only making it worse. The site is great in IE7, IE8, Chrome, FF3. I really wish IE6 would just die already. I know some of the issues are stemming from the CSS navigation menu I got from a CSS menu site (haven't been able to master coding my own drop-downs in CSS), but it appears there's other issues compounding that. Any help would be really appreciated. Here's the site: http://americandancewheels.webscapersites.com/ First, fix the HTML errors. Then remove the stylesheet and start from scratch, specifying only what is absolutely necessary. Why do you want to make the page too small for me to read? That's what you do with font-size: 62.5%. Then you increase the size so it is still to small for me to read comfortably. -- Chris F.A. Johnson http://cfajohnson.com === Author: Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress) Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress) __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
On Sun, 7 Feb 2010, Kym Costanzo wrote: I've got a train wreck in IE6, so bad that my attempts to fix this are only making it worse. The site is great in IE7, IE8, Chrome, FF3. I really wish IE6 would just die already. Here's the site: http://americandancewheels.webscapersites.com/ Chris F.A. Johnson wrote: First, fix the HTML errors. Then remove the stylesheet and start from scratch, specifying only what is absolutely necessary. Why do you want to make the page too small for me to read? That's what you do with font-size: 62.5%. Then you increase the size so it is still to small for me to read comfortably. Hi Chris, I will go back to see what extraneous CSS is in my stylesheet. I do re-use styles from site to site so it is possible I had extra in there, though I thought it was all CSS being used for pages that are on the site just not uploaded to the server yet. Regardless, I will check that. In the meantime, regarding your other comments: Could you be more specific about the HTML errors? I did validate the HTML, but the only errors I got were regarding the drop-down menu that I am asking for help with. I can't fix those, as I don't know what I can do differently with that menu. The validation errors have to do with the IE6 hack. Again the menu was one I got from a resource site. If you feel that I need to find a new menu, say so. (sure, coding my own would be better. I'm working on learning how to do that but just not there yet.) Regarding your question about making the page too small for you to read, I am open to any teaching you wish to offer. As I learned CSS, I read over and over that the right way to size fonts is to set the page font size to 62.5% and then increase using ems. I am using a browser resolution of 1280x1024 and the font size I am using is 1.4em, which I felt was a suitable size, and to me, looks comparable to fonts on other sites I see. But if this is not the right way to do it, I'm open to hearing what is. Thanks, Kym __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
Kym Costanzo wrote: I've got a train wreck in IE6, so bad that my attempts to fix this are only making it worse. The site is great in IE7, IE8, Chrome, FF3. I really wish IE6 would just die already. Here's the site: http://americandancewheels.webscapersites.com/ Kym This will not correct all. The intent is to get it started. #home-feature-content{ border: 1px solid red; width: 390px; height: 225px; overflow: hidden; /*padding: 10px 10px 0 10px;*/ padding : 10px 5px 0 5px; } .sidebar-item { border: 1px solid red;; width: 200px; /*margin: 15px;*/ margin: 0; /*padding: 5px 5px 10px 5px;*/ padding: 5px 0 10px 0; border-bottom: 1px dashed #dc4d52; } The width of the 3 images in .sidebar-item is greater than the width of that column. If you can, delete the height and width of those images. Width and the IE/6 box model is problematic more often than not in IE/6. But rather than hacking IE/6, the above changes /may/ help get her back on track... Reference: http://www.satzansatz.de/cssd/onhavinglayout.html Best, ~ -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
At 2/6/2010 10:09 PM, Kym Costanzo wrote: Could you be more specific about the HTML errors? I did validate the HTML, but the only errors I got were regarding the drop-down menu that I am asking for help with. I can't fix those, as I don't know what I can do differently with that menu. The validation errors have to do with the IE6 hack. Kym, you're making a simple typographical error in the HTML comment syntax. Your source code reads: ...![if gt IE 6]/a![endif]!--[if lte IE 6]tabletrtd![endif]--... For each list item, the first IE conditional comment should be correctly embedded in an HTML comment: ...!--[if gt IE 6]/a![endif]--... Regards, Paul __ Paul Novitski Juniper Webcraft Ltd. http://juniperwebcraft.com __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Train wreck in IE6
Kym Costanzo wrote: Here's the site: http://americandancewheels.webscapersites.com/ As I learned CSS, I read over and over that the right way to size fonts is to set the page font size to 62.5% and then increase using ems. Kym So be it. On the other hand it is always advantageous to ignore some of the greatest thinkers of our time and simply accept that the simple purpose of typography is to make content readable. This does not require a degree in higher mathematics. Best, -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/