Re: [css-d] font-size smaller on IE 8 [error correction] - closing this long thread.
Too much errors and inconsistencies. I cannot constantly change the structure and ask questions about specific issues at the same time. I'm absolutely rocking off. Sorry all, Alan, thanks a lot for your template, in order to be able to apply, I would need to print and read line by line. Unfortunately, I don't have that time at the moment, and I'm really really sorry to give you trouble, and then, been unable to follow it properly. Sorry for that. :( Regards, Márcio __ 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] font-size smaller on IE 8 [error correction]
Thank you a million, Sorry for the absence, I will follow your advices once I can get back to the computer for more undeless days and nights. I will give my best. Regards, Márcio __ 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] font-size smaller on IE 8 [error correction]
MEM wrote: Thank you a million, Sorry for the absence, I will follow your advices once I can get back to the computer for more undeless days and nights. I will give my best. Regards, Márcio Slow and Steady won the race! Best, Aesop -- http://chelseacreekstudio.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] font-size smaller on IE 8 [error correction]
MEM wrote:
(snip
HOWEVER I need to have equal height columns as well, here:
Drop the equal height columns. This is making IE6 show that
margin-bottom of 30,000px.
http://www.chequedejeuner.nuvemk.com/educa.infantil
(snip)
Dispersing,
Márcio
Ok we had.
*LESS IS BETTER*
This also applies to the HTML or XHTML. You have divs wrapping elements
that don't need to be there. This leave us with my second rule.
*FIX HTML BEFORE ATTEMPTING TO FIX CSS*
I have removed most if not all unnecessary HTML. Didn't touch the
footer. Now moving onto to the CSS. First get rid of that reset.css. It
is not needed. This is making it harder to follow all that
inconsequential CSS. Remove all CSS that is targeting nothing. You may
not want to move on to this template yet but please study it and
consider using it over your current code.
http://css-class.com/x/marcio/
Tested in FF3, IE8, IE7 (IE8 Compat Mode IE7) and Safari 4.
BTW, IE6 needs special attention since the page falls apart but it is
way closer to the mark than your current code.
The code only needs one IE7 hack.
*:first-child+html #conteudoProdutoHome {
padding-bottom:28px;
}
--
Alan http://css-class.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] font-size smaller on IE 8 [error correction]
Oh dear new year... a) The ul list on the blue column should be vertically centered. b) The text of the first item on the ul list on the blue column should be, top aligned, with the titles of the grey column. This could have a min-height defined and should NOT follow the column height: http://www.chequedejeuner.nuvemk.com/educa.infantil/vantagens It should stop near voltar. HOWEVER I need to have equal height columns as well, here: http://www.chequedejeuner.nuvemk.com/educa.infantil Because of the li vertical space difference that exists on good browsers, and not on IE, (I believe this is a capital issue) I'm getting different heights and the min-height hack doesn't seem to work. So, I've applied the big margin trick. Should I switch to a faux column technique on this case? What can be done to allow both a) and b) to work cross-browser? (only ie8 and ff3 at least). Dispersing, Márcio __ 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] font-size smaller on IE 8 [error correction]
Oh dear new year... a) The ul list on the blue column should be vertically centered. b) The text of the first item on the ul list on the blue column should be, top aligned, with the titles of the grey column. This could have a min-height defined and should NOT follow the column height: http://www.chequedejeuner.nuvemk.com/educa.infantil/vantagens It should stop near voltar. HOWEVER I need to have equal height columns as well, here: http://www.chequedejeuner.nuvemk.com/educa.infantil Because of the li vertical space difference that exists on good browsers, and not on IE, (I believe this is a capital issue) I'm getting different heights and the min-height hack doesn't seem to work. So, I've applied the big margin trick. Should I switch to a faux column technique on this case? What can be done to allow both a) and b) to work cross-browser? (only ie8 and ff3 at least). Dispersing, Márcio Simplifying: The blue navigation column should be of fixed height with a vertically centered ul list inside. Problem 1: if I give a fixed height, I cannot equal (by using min-height) both columns (the blue and grey) here: http://www.chequedejeuner.nuvemk.com/educa.infantil Is there a way for doing this? Problem 2: Since the lists are getting different vertical space interpretations (so I believe, but I can be wrong) on IE8 and Firefox 3, I'm wondering if it's possible to have the text of the first li element to be *top aligned* with the text title of the grey column, here again: http://www.chequedejeuner.nuvemk.com/educa.infantil Hope this was more clear than the last post, Thanks a lot, Márcio __ 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] font-size smaller on IE 8 [error correction]
MEM wrote: Simplifying: Excellent. Let's think on that, if not actually try it. Márcio Do you mean you seek a parent-block that contains four adjacent column-blocks that would appear to be of the same physical height as the parent-block: regardless of the amount their content; regardless the manner in which their content has been set; regardless the background-color of individual blocks; regardless the font-size used? If so, define no fixed height for the parent-block; and, assign no height for any of the four adjacent column-blocks, contained within the parent block. You already know the available methods for simulating equal-height columns. This time try the simple faux column method. Since I guess you've switched from em to percent for font-size, you may -- for the time being -- want to make it consistent, and change all the em font-settings to percent. Increment change is usually at 5% levels (not 2%), and line-height is usually set as a raw number. Rock-on, or rock-off, but please try to make it happen within our known universe :-) . Thanks. And best, ~d -- http://chelseacreekstudio.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] font-size smaller on IE 8 [error correction]
With a default browser install - no settings altered - which the vast majority of users will be using, that size is very small and a large majority of users don't know they CAN do something about the size of text they are seeing. I reserve that size for disclaimers and copyright lines, and even then some would argue that it's too small for those things too. Seems absolutely fair and valid to me. :) If we allow the user to zoom, You don't have any choice. and if we allow the user to use its own font-size that she/he feels/needs Again, you don't have any choice. I will rephrase, I believe we have the choice to allowed properly or ignore it. So, If we give the change to the user to properly zoom in our site contents... like, what are the consequences of using small fonts like 0.75em, instead of 0.85em ? Like, some users may not be able to read it. This does not mean the world will end if you use. And as mentioned two or three times over the past year or so, a rule of thumb some authors use to set fonts is: Primary content 100%. Secondary content 95%. Tertiary content 90%. I've just read an article on Felix Miata website that show us several options and defenders of each option on the bibliography part. Very nice. I cannot dig in on the subject right know, it's to many key concepts (resolution, dpi, screen size), that I can't follow all of a sudden. From a very simplistic point of view, I realize that the site, on 0.75em is still capable of being seen on lower resolutions, I can see them properly as well, I'm sure not a ruler, and sure the measures can't be done using my own eyes as ruler, still, I'm on a not that usual 1680x1050 screen resolution and, I'm supposing the site visitors will not have so high resolutions as well. (I can stop supposing and actually find it but, unfortunately, I know no statistics about this subjects.) Despite all assumptions, suppositions, believes, and so on, I can just agree that a site that follow 100% / 95% / 90% and as a nice contrast, is more comfortable to read than any other. (except, if that site is seen on a very low resolution. (to many unpleasant/unpractical scroll bars may arrive)). I will have that into consideration and discuss it with the designer on our future layouts. Still, a statistic report on target resolution monitors, would be very VERY handy. :D? Thanks again, Márcio __ 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] font-size smaller on IE 8 [error correction]
On 2009/12/29 14:07 (GMT) MEM composed: If we allow the user to zoom, You don't have any choice. To be clear, a web browser is a user agent, not a webmaster agent, and is subject to the whims and desires of its user who is in control of it to whatever extent she knows how. and if we allow the user to use its own font-size that she/he feels/needs Again, you don't have any choice. I will rephrase, I believe we have the choice to allowed properly or ignore it. So, If we give the change to the user to properly zoom in our site contents... Zoom is a defense feature offered by modern browsers. Absent an offense by a loaded web page, it isn't necessary. Web sites needn't, and shouldn't, be offensive in the first place. Many users zoom in advance, via the method of setting the default according to personal needs instead of leaving it at the OEM setting of 12pt/16px. A larger default setting has exactly the same effect on websites as text-only zoom+, whether via the view menu, keyboard hotkeys, or mouse wheel. Not all users use browsers that offer page zoom, and of those that do, not all like the results of using it. Some instead opt to using zoom text only. Still, a statistic report on target resolution monitors, would be very VERY handy. :D? The best web site designs are resolution agnostic, meaning they work similarly well regardless of a user's display resolution. Display resolution by itself is meaningless. Only when coupled to knowledge of the display's size can the knowledge of its resolution become useful. Still, here you go: http://www.w3counter.com/globalstats.php -- We have no government armed with power capable of contending with human passions unbridled by morality and religion. 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] font-size smaller on IE 8 [error correction]
MEM wrote:
(snip)
I realize that the site, on 0.75em is still
capable of being seen on lower resolutions
(snip)
Thanks again,
Márcio
If you are forced to do this, don't use ems, use percent.
body {font-size: 75%;}
I use ems for widths in navigation items for correct scaling in IE.
#navigation {width: 10em;}
If you use browsers reset like this,
* {margin: 0;}
then it is wise to use ems on vertical margins for elements that contain
text.
#content p, #content ul, #content ol {margin: 1em 0}
Begin to think in percent and not ems when talking about text size.
--
Alan http://css-class.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] font-size smaller on IE 8 [error correction]
The best web site designs are resolution agnostic, meaning they work
similarly well regardless of a user's display resolution. Display
resolution
by itself is meaningless. Only when coupled to knowledge of the
display's
size can the knowledge of its resolution become useful.
I will try my best, and take that into consideration. Still, we cannot
neglect, the fact that big sharks like IBM or Microsoft, Apple... etc...
have, at the moment 1024x in mind... But this could mean nothing, so, I will
take your advice into consideration.
Felix Miata *** http://fm.no-ip.com/
Thanks. :)
If you are forced to do this, don't use ems, use percent.
body {font-size: 75%;}
I will start doing that, actually that was to be my next question (why am I
asking about EM and all of you are replying on %?). I will found some info
on the web.
I use ems for widths in navigation items for correct scaling in IE.
#navigation {width: 10em;}
Ok.
If you use browsers reset like this,
* {margin: 0;}
then it is wise to use ems on vertical margins for elements that
contain
text.
#content p, #content ul, #content ol {margin: 1em 0}
I will use ems as my general measure.
Right now, I was placing the margin, padding declaration and so on into the
containers,
and the font related properties on the p li h1 ... elements inside the
containers.
No?
Begin to think in percent and not ems when talking about text size.
Oook I was on px, then I've been told, em is the thing, however, and
even today, if I look to same main sites I see pt declared... and here we go
to % ... :s Newbie life is hard. :)
--
Alan http://css-class.com/
Thanks as well. :)
Regards,
Márcio
__
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] font-size smaller on IE 8 [error correction]
Ok I've not augmented the font size, was too late for that. :( I've reduced the em to 2 decimal places. I've placed font-sizes in %. Have removed font-size from containers (it's only on p, and other transitional allowed text tags). Added a background color of white to the container. Reduced the different font-sizes from 7 to 5. I've applied some h1 h2 elements. Maybe something is missing, but this was the far I was able to get. :s One inconsistence still prevails, and it's on the left menu (the li items elements I presume). I'm unable to find why is this. If someone as a clue: http://www.chequedejeuner.nuvemk.com/educa.infantil/vantagens Thanks a lot to all, Márcio __ 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] font-size smaller on IE 8 [error correction]
On 2009/12/29 18:22 (GMT) MEM composed: we cannot neglect, the fact that big sharks like IBM or Microsoft, Apple... etc... have, at the moment 1024x in mind... With big comes large inertia, meaning it takes long to recognize the need for and implement change. ...why am I asking about EM and all of you are replying on %?)... Basically, em and % WRT text size are identical twins. Both are just certain ways to write decimal mixed numbers. 110/100, 1.1em 110% are all identical numbers. 1/2, .5em 50% are all identical numbers. 300/100, 3em 100% are all identical numbers. The main difference between em and % has to do with their application to sizes other than text, and is not related to your immediate puzzlement. There is one difference between em and % WRT text size that one who writes CSS that will be used by older IE versions needs to know, but it is a bug that is explained on http://css-discuss.incutio.com/?page=InternetExplorerWinBugs along with an easy workaround. % is often best when you need to size WRT an object other than text, like a viewport or an image. Em usually works best when you need to size WRT text size, which just happens to be an excellent base of reference if you wish high usability, high accessibility and/or resolution independence. Oook I was on px, then I've been told, em is the thing, however, and even today, if I look to same main sites I see pt declared... and here we go to % ... :s Newbie life is hard. :) It's not so bad when you keep it simple as possible, and stop finding non-existent differences. ;-) * WRT = with regard to -- We have no government armed with power capable of contending with human passions unbridled by morality and religion. 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] font-size smaller on IE 8 [error correction]
MEM wrote:
Look at http://fm.no-ip.com/auth/Font/font-rounding.html in each of
your
installed browsers and you may see that more than two significant
digits to
em font-sizes are an invitation for inconsistent results. If you stick
to two
significant digits and take what you learn from that URL into account
you
might get acceptable results cross-browser.
It was amazing to see how much different they can get. I've not seen any EM
units however. (where they the same as the %, since 100%=1em ?)
Default = 100% = 1em until you have nested elements.
The first element in the tree that can have a size (font-size and
height) is the HTML element, then the BODY element and then any other
elements within the body of the document.
I've seen that .pt are quite inconsistent.
pt (points) change apparent visual size via your DPI setting.
Px are precise. (but they not
scale on some browsers)
and the keywords small...etc (are quite nice as well).
The percent, seems to be quite nice also, if we stick with 2 digits. And
because of this also, I associate EM with %. Hope to get it right.
Maybe this will help with your understanding. All sizes adjust according
to your browser text (font) size settings. This also affect the height
given to nested elements, even if it is just a DIV.
http://css-class.com/test/css/text/size.htm
Notice how nested elements have a different size when inside elements
that have a smaller or larger value in ems. Notice also how Default,
100%, and 1em are all the same size.
Please observe that the text with font-size: 0.5em within the container
with font-size: 1.5em is the same size as the text with font-size: 1.5em
within the container with font-size: 0.5em.
I grepped font-size from
http://www.chequedejeuner.nuvemk.com/lib/css/main.css and found 31
lines,
plus a few with just font:. That's probably more than necessary.
Simplify and
see what happens.
What could we do to simplify? Should I remove some font-sizes and let them
been hierarchy applied?
The only font-size that I use for this page,
http://css-class.com/test/
is this.
h1 {font-size:160%;}
h2 {font-size:125%;}
h3 {font-size:115%;}
h4 {font-size:100%;}
a[href=#navigation] {font-size:140%;}
.float2 h3 {font-size:140%;}
#wrapper2+div+div a {font-size:small;}
#wrapper1+div p {font-size:143%;}
Notice how I am only targeting specific elements (ones that contains
text) and not whole containers or boxes. This is how you simplify. The
below two do nothing and are not really needed.
body {font-size: 100%;}
#navigation ul {font-size: 100%;}
Attempting to use ems in the first place when learning leads to the long
path of understanding font-size. My first rule in CSS which I learned
the hard way is,
*LESS IS BETTER*.
--
Alan http://css-class.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] font-size smaller on IE 8 [error correction]
Alan Gresley wrote:
i
The only font-size that I use for this page,
http://css-class.com/test/
is this.
h1 {font-size:160%;}
h2 {font-size:125%;}
h3 {font-size:115%;}
h4 {font-size:100%;}
a[href=#navigation] {font-size:140%;}
.float2 h3 {font-size:140%;}
#wrapper2+div+div a {font-size:small;}
#wrapper1+div p {font-size:143%;}
Notice how I am only targeting specific elements (ones that contains
text) and not whole containers or boxes. This is how you simplify. The
below two do nothing and are not really needed.
body {font-size: 100%;}
#navigation ul {font-size: 100%;}
Attempting to use ems in the first place when learning leads to the
long path of understanding font-size. My first rule in CSS which I
learned the hard way is,
*LESS IS BETTER*.
Well, we're getting there, Felix. No need for math solutions that only
geeks, accountants, pencil-pushers, and their ilk get. The software
understands less is more-- providing the author of the style sheet
understands that concept and is capable of employing it. The software
gets it, understands it, and renders it accordingly and consistantly.
And, more important -- providing the sheet author honors user preference
rather than hers -- users will get their preference.
~d
--
http://chelseacreekstudio.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] font-size smaller on IE 8 [error correction]
On 2009/12/28 19:06 (GMT+0100) Alan Gresley composed:
below two do nothing and are not really needed.
body {font-size: 100%;}[...]
True for good browsers.
For not so good M$ browsers it can be useful when your CSS is less than
ideal: http://css-discuss.incutio.com/?page=InternetExplorerWinBugs
http://fm.no-ip.com/auth/IE/IE6FontInherit3.html
The only thing having it can hurt is your pride in otherwise having reduced
the weight of your CSS to the absolute minimum.
*LESS IS BETTER*.
+1
--
We have no government armed with power capable of
contending with human passions unbridled by morality and
religion. 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] font-size smaller on IE 8 [error correction]
Felix Miata wrote:
On 2009/12/28 19:06 (GMT+0100) Alan Gresley composed:
below two do nothing and are not really needed.
body {font-size: 100%;}[...]
True for good browsers.
Hello Felix,
Yes, I did overlook that old IE6 bug (and possibly IE7). My font-size:
100% is declared to stop it. I first noticed it IE7 in April 2007.
http://css-class.com/test/bugs/ie/ie7-font-size-bug-with-ems.htm
The bug does not show in IE7 compatibility mode in IE8 locally but if my
memory serve me correct, the result is the same as IE6.
Please excuse any errors. This was my first ever test case.
Alan http://css-class.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] font-size smaller on IE 8 [error correction]
Ok... I have a lot on the to do list already. I'm on my way to significantly change the css. In the meanwhile, I'm afraid the design given to me to reproduce, will not allow 0.85em instead of 0.75em, for example, simple because the text will not fit on the boxes. In order to allow something like that, probably some layout structure needs to change. The dead line is near, and I'm stressing. Still, I'd like to ask: If we allow the user to zoom, and if we allow the user to use its own font-size that she/he feels/needs like, what are the consequences of using small fonts like 0.75em, instead of 0.85em ? Please advice, Márcio __ 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] font-size smaller on IE 8 [error correction]
With a default browser install - no settings altered - which the vast majority of users will be using, that size is very small and a large majority of users don't know they CAN do something about the size of text they are seeing. I reserve that size for disclaimers and copyright lines, and even then some would argue that it's too small for those things too. I am sure a more complex reason is to come. ;-) If we allow the user to zoom, and if we allow the user to use its own font-size that she/he feels/needs like, what are the consequences of using small fonts like 0.75em, instead of 0.85em ? Please advice, Márcio __ 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/ -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.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] font-size smaller on IE 8 [error correction]
MEM wrote: Ok... I have a lot on the to do list already. I'm on my way to significantly change the css. In the meanwhile, I'm afraid the design given to me to reproduce, will not allow 0.85em instead of 0.75em, for example, simple because the text will not fit on the boxes. In order to allow something like that, probably some layout structure needs to change. The dead line is near, and I'm stressing. Still, I'd like to ask: If we allow the user to zoom, You don't have any choice. and if we allow the user to use its own font-size that she/he feels/needs Again, you don't have any choice. like, what are the consequences of using small fonts like 0.75em, instead of 0.85em ? Like, some users may not be able to read it. This does not mean the world will end if you use. And as mentioned two or three times over the past year or so, a rule of thumb some authors use to set fonts is: Primary content 100%. Secondary content 95%. Tertiary content 90%. Please advice, Márcio ~d _ ~d -- http://chelseacreekstudio.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] font-size smaller on IE 8 [error correction]
Hello all, Sorry to bother again with this issue... If we stay with 1em, all fonts size will be equal. However, if we do less then 1em, (no matter what value I suppose) we just get inconsistent results. I know the browsers should not look exactly equal, that's the own nature of browsers but, at I would like them to be, at least, similar. Right now, however, the results are quite different. Any advice regarding this issue? http://www.chequedejeuner.nuvemk.com/educa.infantil/associar Thanks a lot, Márcio __ 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] font-size smaller on IE 8 [error correction]
On 2009/12/27 18:06 (GMT) MEM composed: Sorry to bother again with this issue... If we stay with 1em, all fonts size will be equal. However, if we do less then 1em, (no matter what value I suppose) we just get inconsistent results. I know the browsers should not look exactly equal, that's the own nature of browsers but, at I would like them to be, at least, similar. Right now, however, the results are quite different. Any advice regarding this issue? http://www.chequedejeuner.nuvemk.com/educa.infantil/associar Look at http://fm.no-ip.com/auth/Font/font-rounding.html in each of your installed browsers and you may see that more than two significant digits to em font-sizes are an invitation for inconsistent results. If you stick to two significant digits and take what you learn from that URL into account you might get acceptable results cross-browser. I grepped font-size from http://www.chequedejeuner.nuvemk.com/lib/css/main.css and found 31 lines, plus a few with just font:. That's probably more than necessary. Simplify and see what happens. Several sizes are specified at less than .75em. That's generally too small. Those with a minimum font size enforced are liable to find most text on the page rendered identically in size. e.g., my minimum when set is at 80% or more of my default, while your CSS has more than half its sizes set to .75em or less. -- We have no government armed with power capable of contending with human passions unbridled by morality and religion. 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] font-size smaller on IE 8 [error correction]
MEM wrote: Any advice regarding this issue? http://www.chequedejeuner.nuvemk.com/educa.infantil/associar Márcio Marcio, If I open one of your pages in IE/8 and the open the same page in Firefox and veiw them adjacent to each other the pixel height of the text block is nearly identical. And you are relatively close in IE/7. If the client wants to hit IE/6 you have some positioning to correct and you'll need the iepngfix. View your page at minimum font-size 24px in FF and maybe that will give you a clue to the problem Felix mentioned. It is even far worse at minimum font-size 32px in Opera. Fwiw, I default to fuchsia as a background-color to catch myself from forgetting to declare a background-color on my own stuff... :-) Best, ~d -- http://chelseacreekstudio.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] font-size smaller on IE 8 [error correction]
Look at http://fm.no-ip.com/auth/Font/font-rounding.html in each of your installed browsers and you may see that more than two significant digits to em font-sizes are an invitation for inconsistent results. If you stick to two significant digits and take what you learn from that URL into account you might get acceptable results cross-browser. It was amazing to see how much different they can get. I've not seen any EM units however. (where they the same as the %, since 100%=1em ?) I've seen that .pt are quite inconsistent. Px are precise. (but they not scale on some browsers) and the keywords small...etc (are quite nice as well). The percent, seems to be quite nice also, if we stick with 2 digits. And because of this also, I associate EM with %. Hope to get it right. I grepped font-size from http://www.chequedejeuner.nuvemk.com/lib/css/main.css and found 31 lines, plus a few with just font:. That's probably more than necessary. Simplify and see what happens. What could we do to simplify? Should I remove some font-sizes and let them been hierarchy applied? Several sizes are specified at less than .75em. That's generally too small. Those with a minimum font size enforced are liable to find most text on the page rendered identically in size. e.g., my minimum when set is at 80% or more of my default, while your CSS has more than half its sizes set to .75em or less. Ok. So since I'm not using % but EM, I believe 8em minimum should be the limit. Since 100% will correspond to 1em. Before this however, I must take care of inconsistencies. @David I will deal with IE6 later on the process. I have downgrade the font scale on IE to smallest and on FF to 9pt, and I get some layout misplacements. :( It's bad because the user should have the possibility to freely choose which font size he/she wants and the site structure should behave. Is this what you and Felix where talking about? If so, could we induce that this is due to several font-sizes cross the css that will end up rounded differently when we change the font size, hence, leading to the visual glitches we see? Fwiw, I default to fuchsia as a background-color to catch myself from forgetting to declare a background-color on my own stuff... :-) Very nice idea. I tend to wrongly assume that the white is like standard for everyone and that it can't be changed. Thanks for the tip. If I made some misinterpretation, please let me know. In the meanwhile, I will try to simplify the fonts. Best Regards, Márcio __ 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] font-size smaller on IE 8 [error correction]
MEM wrote: @David I will deal with IE6 later on the process. OK. It's bad because the user should have the possibility to freely choose which font size he/she wants and the site structure should behave. Is this what you and Felix where talking about? If so, could we induce that this is due to several font-sizes cross the css that will end up rounded differently when we change the font size, hence, leading to the visual glitches we see? Note that in FF at minimum font-size 24 on your page that, among other things, in the 4 panel apron the text is clipped right in apron-panels 2 and 3. And since too many cooks spoil the broth, rather than to confuse matters more, I leave the trivial pursuit of typography to you and Felix to resolve. Very nice idea. I tend to wrongly assume that the white is like standard for everyone and that it can't be changed. Thanks for the tip. If you make no assumption about the typography, as well, things are likely to go easier and better for you, your client, and more important-- your client's users :-) . Márcio ~d -- http://chelseacreekstudio.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] font-size smaller on IE 8 [error correction]
On 12/27/09 11:04 AM, Felix Miata wrote: On 2009/12/27 18:06 (GMT) MEM composed: Sorry to bother again with this issue... If we stay with 1em, all fonts size will be equal. However, if we do less then 1em, (no matter what value I suppose) we just get inconsistent results. I know the browsers should not look exactly equal, that's the own nature of browsers but, at I would like them to be, at least, similar. Right now, however, the results are quite different. Any advice regarding this issue? http://www.chequedejeuner.nuvemk.com/educa.infantil/associar Look at http://fm.no-ip.com/auth/Font/font-rounding.html in each of your installed browsers and you may see that more than two significant digits to em font-sizes are an invitation for inconsistent results. If you stick to two significant digits and take what you learn from that URL into account you might get acceptable results cross-browser. [...] Further to Felix's good advice to stick to 2 decimal places in em sizes (so no fractions of 1%)... Some time ago, I ran a series of automated tests on font scaling, testing on all the browsers I had at the time. As you discovered, each browser engine has its own way of rounding fractions. Webkit, for example, simply ignores any fraction of 1%, while Gecko not only rounds fractions, but also seems to carry fractions forward, rounding accumulated values. I find I get the most consistent results from using these percentages, which scale quite well. For example, if font-size of 82% gives 13px, then 5em will very likely give 65px in all browsers. 8pt brevier 11px69% 9pt bourgeois 12px75% 10pt long primer13px82% 11pt small pica 15px94% 12pt pica 16px100% 14pt english19px119% 16pt columbian 21px132% 18pt great primer 24px150% (The pixel sizes will vary according to computer settings.) Hope this helps. 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] font-size smaller on IE 8 [error correction]
David Hucklesby wrote: Further to Felix's good advice to stick to 2 decimal places in em sizes (so no fractions of 1%)... I find I get the most consistent results from using these percentages, which scale quite well. For example, if font-size of 82% gives 13px, then 5em will very likely give 65px in all browsers. Cordially, David Huh? Is it really so difficult to use CSS in order to make words consistently the same size and easy to read on a screen cross-browser that one needs to resort to that kind of pseudo scientific gibberish? ~d -- http://chelseacreekstudio.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] font-size smaller on IE 8 [error correction]
On 2009/12/28 00:05 (GMT-0500) David Laakso composed: David Hucklesby wrote: Further to Felix's good advice to stick to 2 decimal places in em sizes (so no fractions of 1%)... I find I get the most consistent results from using these percentages, which scale quite well. For example, if font-size of 82% gives 13px, then 5em will very likely give 65px in all browsers. Huh? Is it really so difficult to use CSS in order to make words consistently the same size and easy to read on a screen cross-browser that one needs to resort to that kind of pseudo scientific gibberish? Pseudo scientific gibberish? Where/what/how? OTOH, I do see an apparent math problem. For 5em to be 65px would mean 1em has to be 13px, but that's inconsistent with 82% being 13px unless cascade converted 1em from 16px down to 13px. Really, if one simply stops thinking in px for sizing, adaptive design (fluid, liquid, jello, elastic, etc.) can be easier. Default defaults can instead be thought of as 16ths for fractions of 1em, which often works out better for rounding, since puters natively operate in binary rather than decimal: 1/16 = 6.25% round up to .07em 2/16 = 12.5% round up to .13em 3/16 = 18.75% round up to .19em 4/16 = 25% = .25em 5/16 = 31.25% round up to .32em 6/16 = 37.5% round up to .38em 7/16 = 43.75% round up to .44em 8/16 = 50% = .5em etc. When you want line lengths of 60 chars (480px), use 30em. When you want nav links width of 18 chars (144px), use 9em. When you have a 240px intrinsic width image, set its width to 15em. Etc. Then when a user's actual default is something other than 16px to start with, the proportions will nevertheless hold up reasonably, remembering of course that most visitors visit using personal computers that they may have personalized beyond mere changing of desktop wallpaper, plus: http://dowebsitesneedtolookexactlythesameineverybrowser.com/ -- We have no government armed with power capable of contending with human passions unbridled by morality and religion. 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] font-size smaller on IE 8 [error correction]
Pseudo scientific gibberish? Where/what/how? I am not able to speak for the OP. However, considering he is has a little language barrier problem (no offense intended), I'd think that an open, honest, direct, and specific answer to his question might be appropriate. And nursing him through the final solution might be even more appropriate. Nevertheless, since he has, to his credit, an extremely inquisitive mind, I am quite sure your little math/science example will, I hope, cinch the knot that will solve his repeated question that has already been answered more than once. Best, ~d -- http://chelseacreekstudio.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] font-size smaller on IE 8 [error correction]
one thing I've found that helps on organizing the font sizes was in an A List Apart article last year (?). The idea was to have 3 style sheets: one for fonts, one for colors, and one for layout related stuff (positioning, borders, margins, etc). There's a bit of extra page weight involved, since you end up declaring the same selectors a few times, but I've found that it does make keeping track of your styles easier. Fewer things get lost. ---Tim It sure is an idea for organizing things. And I surely need to find a way to organize what will became 1000 lines of css code. Thanks for the usefull tip, I will surely take a look into that. Found the link: http://www.alistapart.com/articles/progressiveenhancementwithcss Thanks once again, Márcio __ 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] font-size smaller on IE 8 [error correction]
body
{
/*line-height: 1;*/ :: delete rule rule
font : 1em/normal 'Helvetica Neue', Helvetica, Arial,
sans-serif; :: delete entire rule
}
Shoud read:
body
{
/*line-height: 1;*/ :: delete rule
font : 1em/normal 'Helvetica Neue', Helvetica, Arial, sans-serif; :: *ADD
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] font-size smaller on IE 8 [error correction]
All done I believe. Changed to Helvetica Neue. Removed the css specific to IE8 (not needed yet). I've not even look on IE6 and so on. But I will later on the process. Adventuring on the EM land surely deserves quite of organization on the font side of things. I will pay better attention on the future (so I believe). The side menu still shows some issues cross-browser between IE8 and others. I can leave with that. Users can read, can zoom, so, I guess it will be ok. Thanks a lot again and again, Márcio __ 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] font-size smaller on IE 8 [error correction]
Adventuring on the EM land surely deserves quite of organization on the font side of things. I will pay better attention on the future (so I believe). Yes it does, sort of. Font size shouldn't vary too much on a page though. tons of different font sizes tend to make things messy and hard to read. But one thing I've found that helps on organizing the font sizes was in an A List Apart article last year (?). The idea was to have 3 style sheets: one for fonts, one for colors, and one for layout related stuff (positioning, borders, margins, etc). There's a bit of extra page weight involved, since you end up declaring the same selectors a few times, but I've found that it does make keeping track of your styles easier. Fewer things get lost. ---Tim __ 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/
