Re: [css-d] site check for spacing issues
On 23-Mar-07, at 10:53 PM, David Hucklesby wrote: Both Opera and IE increase em-based font sizes by 25%,... Hello, Is that a generally true statement? Or was it in reference only to the site under discussion? I ask because I'm having a problem with button text sliding out to the right of the button borders, and this problem shows mostly in IE and Opera (Safari too). This is in a Zen Cart template I've been customizing. You can see it at www.artcardshop.com/store if you're so inclined, though I don't expect any great enthusiasm among you folks for making a shopping cart template work. ;-) I'm really just interested in the generality of that statement, and perhaps in a few links to discussions or workarounds. TIA Rob Rob Stevenson V.P. Thistle Dance Publishing __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check for spacing issues
Rob Stevenson wrote: On 23-Mar-07, at 10:53 PM, David Hucklesby wrote: Both Opera and IE increase em-based font sizes by 25%,... Hello, Is that a generally true statement? Or was it in reference only to the site under discussion? I ask because I'm having a problem with button text sliding out to the right of the button borders, and this problem shows mostly in IE and Opera (Safari too). This is in a Zen Cart template I've been customizing. You can see it at www.artcardshop.com/store if you're so inclined, though I don't expect any great enthusiasm among you folks for making a shopping cart template work. ;-) I'm really just interested in the generality of that statement, and perhaps in a few links to discussions or workarounds. TIA Rob Rob Stevenson V.P. Thistle Dance Publishing The problem you are having in every browser except IE6.0 has nothing to do with font-size. Regards, ~dL PS Thou shalt not steal the thread :-) . -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check for spacing issues
On 3/23/07, David Hucklesby [EMAIL PROTECTED] wrote: Hi Jeffrey, I took a look at your page on my laptop with IE7 and Opera 9: http://www.melissagerstein.com/tests/akon/akon.htm Because I have a high-definition screen, Windows is set to 120 DPI. Both Opera and IE increase em-based font sizes by 25%, so the alphabet spills onto two lines. Worse, IE7 (not IE6) covers the second line (X Y Z). You may also get this problem if a visitor does not have Arial installed (rare). Mixing text and images like your header is often problematical, especially as you have a tight fit. It will break at any increase in text size. Suggestion (sure to raise some hackles): Make the whole header, including the alphabet, an image. Position a list (preferably using margins) over the alphabet, styled as a horizontal list of square-shaped and appropriately sized links. Floating list items and anchors left will line them up over the letters, kind of like the Night of the image map but with floated links instead of absolute positioning: http://alistapart.com/articles/imagemap You could even use foreground images in those links. You could then apply visibility: hidden to these on hover to get a mouse-over effect. With an alt attribute on each image, you get a working web page with images and/or CSS off. on a side note: does the double-margin float bug effect only horizontal margins? Correct. And only on the float side (example: margin-left for float:left.) Use display:inline on IE floats to fix. Or avoid margins on floats. Cordially, David -- Thanks David, I had no idea about the increasing text size. will this happen with pixels also? i guess i shall have to revisit the site and make the appropriate changes. thanks again! Cheers, Jeff __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check for spacing issues
On Sat, 24 Mar 2007 10:04:34 -0300, Rob Stevenson wrote: On 23-Mar-07, at 10:53 PM, David Hucklesby wrote: Both Opera and IE increase em-based font sizes by 25%,... Hello, Is that a generally true statement? Or was it in reference only to the site under discussion? That is universally true when Windows DPI setting is 120 DPI, as compared with more normal 96 DPI. High definition laptops such as my 1440 x 1050 pixel screen usually have factory settings set to 120 DPI. It can be changed up or down by the owner, but most people likely just take the factory setting. There are several other ways in which a computer user can alter text size, including setting a minimum font size, or putting IE in accessibility mode to ignore font sizes specified on web pages. As mentioned, the width of a letter varies from font to font, so if the font-family you specify is not on a visitor's machine, the browser will substitute another font, possibly slightly wider than the Arial you specified. Hope this helps, and does not discourage you. Cordially, David -- www.hucklesby.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check for spacing issues
On 24-Mar-07, at 10:36 AM, ~davidLaakso wrote: PS Thou shalt not steal the thread :-) . Sorry! Enthusiasm made me do it. Back to your regularly scheduled programming Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check for spacing issues
Hi Jeffrey, I took a look at your page on my laptop with IE7 and Opera 9: http://www.melissagerstein.com/tests/akon/akon.htm Because I have a high-definition screen, Windows is set to 120 DPI. Both Opera and IE increase em-based font sizes by 25%, so the alphabet spills onto two lines. Worse, IE7 (not IE6) covers the second line (X Y Z). You may also get this problem if a visitor does not have Arial installed (rare). Mixing text and images like your header is often problematical, especially as you have a tight fit. It will break at any increase in text size. Suggestion (sure to raise some hackles): Make the whole header, including the alphabet, an image. Position a list (preferably using margins) over the alphabet, styled as a horizontal list of square-shaped and appropriately sized links. Floating list items and anchors left will line them up over the letters, kind of like the Night of the image map but with floated links instead of absolute positioning: http://alistapart.com/articles/imagemap You could even use foreground images in those links. You could then apply visibility: hidden to these on hover to get a mouse-over effect. With an alt attribute on each image, you get a working web page with images and/or CSS off. on a side note: does the double-margin float bug effect only horizontal margins? Correct. And only on the float side (example: margin-left for float:left.) Use display:inline on IE floats to fix. Or avoid margins on floats. Cordially, David -- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
