Re: [css-d] site check, particularly on ie6 ?
snak detek+0r wrote:
Nothing silly about that page in my humble opinion. The page is
short because there is not much content on it. If you want it, and
other pages that may have little content, to appear deeper-- get
creative and add a generic image beneath the text of same.
sigh. Adding unneeded images? That's certainly not very semantic.
Hmm. On the short page, add a class to the last line with a padding
bottom on it to drive the footer down, something like: p.last
{padding-bottom: whatever px;}
Thanks for the heads up on the right margin problem, too. Actually
trasnfered this to the 'live server' before noticing that, but I'll
have you know that I did finally catch and fix this problem several
days ago
Good :-) !
And thanks for the earlier (still continuing) lesson on font scaling.
Typography is not a rocket science. It is about making content readable.
Nothing more.
josh
~d
__
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] site check, particularly on ie6 ?
yes yes, i know. but that will break my background image. that's what i
was trying to say before: the only reason i used overflow:hidden is that
it somehow made the bg work (what i'm talking about visually is that the
main/middle section of that vertical silver divider line).
i see now that this was the wrong way to get the image to tile; what's
the right way?
thanks!
josh
David Laakso wrote:
snak detek+0r wrote:
trimmed
actually, since i got to check this on ie6 today, i did notice a huge
problem (perhaps better asked under separate cover; not sure?). the
problem can be easily seen here:
http://tinyurl.com/nd27cr
IE/6 does not support min-height and is honoring height:500px;
The correction is to let content determine height. Compliant browsers,
and IE/7 will all go along with this; and, IE/6 will follow suit.
#content { border: 1px solid red (4 position only--delete);
width:580px;
overflow:hidden;
margin: 0 0 0 190px;
min-height:500px (delete rule);
height:auto !important (delete rule);
height:500px (delete rule);
}
__
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] site check, particularly on ie6 ?
snak detek+0r wrote: yes yes, i know. but that will break my background image. that's what i was trying to say before: the only reason i used overflow:hidden is that it somehow made the bg work (what i'm talking about visually is that the main/middle section of that vertical silver divider line). i see now that this was the wrong way to get the image to tile; what's the right way? thanks! josh Seems to tile fine in all my browsers, including IE 6/7/8, leaving it where you had it, on #container. Please see: http://chelseacreekstudio.com/ca/cssd/snak.htm What browser on your end does not tile it as you intend? PS Please bottom post in reply __ 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] site check, particularly on ie6 ?
snak detek+0r wrote:
trimmed
actually, since i got to check this on ie6 today, i did notice a huge
problem (perhaps better asked under separate cover; not sure?). the
problem can be easily seen here:
http://tinyurl.com/nd27cr
IE/6 does not support min-height and is honoring height:500px;
The correction is to let content determine height. Compliant browsers,
and IE/7 will all go along with this; and, IE/6 will follow suit.
#content { border: 1px solid red (4 position only--delete);
width:580px;
overflow:hidden;
margin: 0 0 0 190px;
min-height:500px (delete rule);
height:auto !important (delete rule);
height:500px (delete rule);
}
__
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] site check, particularly on ie6 ?
That's good to know. I guess it's not surprising; it is, however, rather disconcerting. My basic instinct is to set the base at 10px, simply so i can work in units that I'm used to. If everything is multiples of ten it makes ems a much more intelligible unit too. I guess I've been going about this all wrong all along. Better late then never, though! Felix Miata wrote: On 2009/05/30 09:45 (GMT-0700) David Hucklesby composed: FWIW - I have set a modest minimum font size of 12px on my browsers. My primary browser, Opera 9.6 on Mac, scales up _all_ fonts on pages that have the seemingly popular 62.5% font-size set on BODY. It amazes me how many pages break with that slight increase. :( .625 * 16 is 10. 12 is 120% of 10. I wouldn't call 20% particularly slight in a context where people notice as little as 1px differences. My minimum font sizes vary between 15px 18px depending on resolution and default setting (between 20px 24px). Few 62.5% body pages fail to at least partially disintegrate for me unless I make them useless by disabling minimum font size. :-( Good thing modern browsers allow to disable styles entirely. __ 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] site check, particularly on ie6 ?
David Laakso wrote:
...
IE/6 does not support min-height and is honoring height:500px;
The correction is to let content determine height. Compliant browsers,
and IE/7 will all go along with this; and, IE/6 will follow suit.
#content { border: 1px solid red (4 position only--delete);
width:580px;
overflow:hidden;
margin: 0 0 0 190px;
min-height:500px (delete rule);
height:auto !important (delete rule);
height:500px (delete rule);
}
Oh, I understand what you're suggesting now. And yes, that doesn't
interfere with my tiling background. But it does end up with certain
pages looking a little silly:
http://tinyurl.com/mfyyuf
That's why I started using that min-height hack in the first place. Sure
you can just add line breaks, but since this is a CMS site, I'd like to
give the client something that is easier to use than that.
Isn't there an easier way? Or perhaps the question is: is there a better
way of achieving min-height? Or perhaps the best I'm going to get is to
make ie6 just work, and no more, while the other browsers will
actually work AND look good.
...josh
__
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] site check, particularly on ie6 ?
On 2009/05/31 18:14 (GMT-0400) snak detek+0r composed: My basic instinct is to set the base at 10px, simply so i can work in units that I'm used to. If everything is multiples of ten it makes ems a much more intelligible unit too 10 does seem easy on the surface, as most of us are used to using metric values by now, it's preached by the Clagnut 62.5% article and its progeny, and practiced by a lot of sites, including some biggies. However, puters aren't so happy with base 10 as with base 2. When they need to divide 10px by 3, 4 or 6, they get fractions, which the browsers typically handle not too consistently. It's not as big a problem if you use the default default font size (1em=16px) as the base. That em is evenly divisible by 2, 4, 8 16, so you can work in 1/4's (.25), 1/8's (.125) /or 1/16's (.0625) and always be working in whole px. -- A fool gives full vent to his anger, but a wise man keeps himself under control. Proverbs 29:11 NIV 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] site check, particularly on ie6 ?
Index and all inside pages: Neither Opera or The IEs are capable of scaling line-height set in pixels. Try a raw number for line-height. wow. didn't even know i could do that. the w3 site doesn't even mention that you can use px, but everyone and their mom seem to, including ALA, some grid-layout people, etc. sheesh. i normally use em, when starting from scratch, but apparently that's wrong too? No, 'em' for line-height isn't wrong. The resulting line-height is just calculated different from when raw numbers are used. For line-height:'em' values gives line-heights based on actual font-size for an element's parent, which is ok if that's what you want. When raw numbers (no unit) are used, line-height is calculated from actual font-size of the element itself, which in most cases gives the best result. Since I'm still trying to get my mind around this (and the w3 rules are quite hard to parse IMO), I was just playing around with my own styles when I noticed that the original base line-height value for this project was set using %: font-size: 100%; This is taken directly from Eric Meyer's reset stylesheet http://meyerweb.com/eric/tools/css/reset/index.html And I always assume he knows what he's doing. Since he's also not changing the font size (100% pretty much means say the same), is this rule simply included to dictate the way line-height is calculated on descendants? josh __ 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] site check, particularly on ie6 ?
snak detek+0r wrote: Oh, I understand what you're suggesting now. And yes, that doesn't interfere with my tiling background. But it does end up with certain pages looking a little silly: http://tinyurl.com/mfyyuf Nothing silly about that page in my humble opinion. The page is short because there is not much content on it. If you want it, and other pages that may have little content, to appear deeper-- get creative and add a generic image beneath the text of same. And if you are really concerned with what is truly silly consider your content text is clipped on the right side of pages whose text runs deeper than that short page; and, that landing on pages whose horizontal and vertical navigation is larger or more important than the primary content text that is set as mousetype is a real PITA. __ 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] site check, particularly on ie6 ?
On 2009/05/31 19:19 (GMT-0400) snak detek+0r composed: Since I'm still trying to get my mind around this (and the w3 rules are quite hard to parse IMO), I was just playing around with my own styles when I noticed that the original base line-height value for this project was set using %: font-size: 100%; This is taken directly from Eric Meyer's reset stylesheet http://meyerweb.com/eric/tools/css/reset/index.html And I always assume he knows what he's doing. Since he's also not changing the font size (100% pretty much means say the same), is this rule simply included to dictate the way line-height is calculated on descendants? Nothing to do with line-height, just insurance against IE bugs: http://css-discuss.incutio.com/?page=InternetExplorerWinBugs -- A fool gives full vent to his anger, but a wise man keeps himself under control. Proverbs 29:11 NIV 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] site check, particularly on ie6 ?
snak detek+0r wrote: Index and all inside pages: Neither Opera or The IEs are capable of scaling line-height set in pixels. Try a raw number for line-height. wow. didn't even know i could do that. the w3 site doesn't even mention that you can use px, but everyone and their mom seem to, including ALA, some grid-layout people, etc. sheesh. i normally use em, when starting from scratch, but apparently that's wrong too? No, 'em' for line-height isn't wrong. The resulting line-height is just calculated different from when raw numbers are used. For line-height:'em' values gives line-heights based on actual font-size for an element's parent, which is ok if that's what you want. When raw numbers (no unit) are used, line-height is calculated from actual font-size of the element itself, which in most cases gives the best result. Index: Minimum font-size 24px breaks the h-nav and does a little number on the text in right column. i'm not sure what you mean by this? i don't have any fonts nearly that big. and i also couldn't see what you're talking about in ff/chrome. today i got ahold of ie6, and still didn't see it. David is referring to a browser setting - 'minimum font size' option - that some end-users set to resize text on _all_ sites... http://www.gunlaug.no/contents/wd_1_03_04.html http://www.gunlaug.no/contents/wd_additions_37.html ...without having to bother with resizing or zooming on individual sites. Observations across the web indicates that few web designers know about, or test for, this option. The result is that many sites break under the stress of browsers' 'minimum font size'. (Note: Fx 3+ resizes text more or less like Safari does for the 'minimum font size' option in most but apparently not in all cases. Google Chrome doesn't seem to have this option.) regards Georg -- http://www.gunlaug.no __ 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] site check, particularly on ie6 ?
Gunlaug Sørtun wrote: snak detek+0r wrote: [...] Index: Minimum font-size 24px breaks the h-nav and does a little number on the text in right column. i'm not sure what you mean by this? i don't have any fonts nearly that big. and i also couldn't see what you're talking about in ff/chrome. today i got ahold of ie6, and still didn't see it. David is referring to a browser setting - 'minimum font size' option - that some end-users set to resize text on _all_ sites... http://www.gunlaug.no/contents/wd_1_03_04.html http://www.gunlaug.no/contents/wd_additions_37.html ...without having to bother with resizing or zooming on individual sites. Observations across the web indicates that few web designers know about, or test for, this option. The result is that many sites break under the stress of browsers' 'minimum font size'. [...] FWIW - I have set a modest minimum font size of 12px on my browsers. My primary browser, Opera 9.6 on Mac, scales up _all_ fonts on pages that have the seemingly popular 62.5% font-size set on BODY. It amazes me how many pages break with that slight increase. :( Cordially, David -- __ 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] site check, particularly on ie6 ?
On 2009/05/30 09:45 (GMT-0700) David Hucklesby composed: FWIW - I have set a modest minimum font size of 12px on my browsers. My primary browser, Opera 9.6 on Mac, scales up _all_ fonts on pages that have the seemingly popular 62.5% font-size set on BODY. It amazes me how many pages break with that slight increase. :( .625 * 16 is 10. 12 is 120% of 10. I wouldn't call 20% particularly slight in a context where people notice as little as 1px differences. My minimum font sizes vary between 15px 18px depending on resolution and default setting (between 20px 24px). Few 62.5% body pages fail to at least partially disintegrate for me unless I make them useless by disabling minimum font size. :-( Good thing modern browsers allow to disable styles entirely. -- A fool gives full vent to his anger, but a wise man keeps himself under control. Proverbs 29:11 NIV 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] site check, particularly on ie6 ?
snak detek+0r wrote: Subject: [css-d] site check, particularly on ie6 ? there are two different layouts, front page http://tinyurl.com/pxgydd and all other pages http://tinyurl.com/msyk76 fingers crossed, thanks! No amount of finger-crossing will solve the 404s on both style sheet links. Mark P.S. My posts have been coming through rather intermittently of late - including the occasional lengthy delay - so if by the time you receive this the question has been answered, you know why! __ 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] site check, particularly on ie6 ?
David, thanks for your gracious feedback. unfortunately, i'm not sure if i understand much of what you had to say (my comprehension stats are usually pretty decent too); explanation below. also, at the bottom is a newly discovered problem its the sort of thing i can't reason, but that i know this list has a ready answer for. David Laakso wrote: Index and all inside pages: Neither Opera or The IEs are capable of scaling line-height set in pixels. Try a raw number for line-height. wow. didn't even know i could do that. the w3 site doesn't even mention that you can use px, but everyone and their mom seem to, including ALA, some grid-layout people, etc. sheesh. i normally use em, when starting from scratch, but apparently that's wrong too? at least if the following is equivalent to what you said: w3.org : This differs from a percentage value in the way it inherits: when a numerical value is specified, child elements will inherit the factor itself, not the resultant value. Index: Minimum font-size 24px breaks the h-nav and does a little number on the text in right column. i'm not sure what you mean by this? i don't have any fonts nearly that big. and i also couldn't see what you're talking about in ff/chrome. today i got ahold of ie6, and still didn't see it. All pages: Minimum font-size 24px does a little number on the vertical-nav and the text in right column. ditto. sounds bad but i can't see it. IE 6/7/8 look relatively similar and in good order on a very quick and cursory check. actually, since i got to check this on ie6 today, i did notice a huge problem (perhaps better asked under separate cover; not sure?). the problem can be easily seen here: http://tinyurl.com/nd27cr my page content get's cut off on ALL pages w/ content longer than the containing div. this is due to an interpretation of a overflow:hidden, and i can certainly remove this *except* that it is there to get my vertical silver divider bar thing to correctly repeat-y all the way down. i rendered this page on browsershots, and it looked like ie7/8 don't have this problem. (can anyone reading verify this?) in any case, i need to fix this. perhaps you or another can tell me the correct way to do this? i'm sure this one is a known quantity. PS Not nice to put IE users at the mercy of putting your stuff in accessibility mode in order to get their font-size preference -- rather than yours :-) . no doubt! if i can only figure out what it was i did! after all, i've got nothing against the ie USERS thanks so much again, josh __ 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] site check, particularly on ie6 ?
snak detek+0r wrote: there are two different layouts, front page http://tinyurl.com/pxgydd and all other pages http://tinyurl.com/msyk76 Index and all inside pages: Neither Opera or The IEs are capable of scaling line-height set in pixels. Try a raw number for line-height. Index: Minimum font-size 24px breaks the h-nav and does a little number on the text in right column. All pages: Minimum font-size 24px does a little number on the vertical-nav and the text in right column. From the inside pages, there is no (obvious) way to get back to the index (I guessed and clicked the header). IE 6/7/8 look relatively similar and in good order on a very quick and cursory check. Validating the markup and CSS could be a nice touch... PS Not nice to put IE users at the mercy of putting your stuff in accessibility mode in order to get their font-size preference -- rather than yours :-) . __ 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/
