Re: [css-d] Son of Suckerfish problem in IE7
On 26/03/07, Ingo Chao [EMAIL PROTECTED] wrote:
It's IE6's old stuck-on-hover bug with the ingredient of a mouse click
as a trigger.
#mainnav li:hover {background-position: 0 0}
fixes it.
IE6 itself does not show this stuck-on-hover phenomenon in
suckerfish-type menus: to process the li:hover on any element, the
sfHover = function() already does register an user event with
onmouseover and applies a new class sfhover to li. So there is no need
for this fix in IE6.
http://www.satzansatz.de/cssd/pseudocss.html#hoverstuck
I could have sworn I tried that one and it didn't work, but I've just tried
it again and it works! Go figure.
Thanks. :)
Seona.
__
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] Son of Suckerfish problem in IE7
On 26/03/07, francky [EMAIL PROTECTED] wrote: Hi Seona, Apart from this, I notice that (while the html is validating) the css-validator is reporting a I/O error and doesn't go on. And looking at the code of the page, I see some strange double ##'s in the conditional comments. Screenshot http://home.tiscali.nl/developerscorner/css-discuss/images/doublecross.gif Maybe this can have some influence too? Hmm... I'll have to look into that error, thanks for pointing that out. The double hashes are just to escape them when they appear within the main document instead of a CSS file, since ColdFusion processes hashes as part of it's way of working things (they come in pairs and surround variables). So if you want to actually have a hash show up, you need to put two of them. At any rate, since the fix doesn't seem to do anything nasty in IE6, I've ditched the 7-specific CC and moved the style rule to the IE CSS file so we're back to single hashes again. :) Thanks. :) Seona. __ 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] Random float drops
Richard Grevers wrote: We are getting random float drops on the newly redesigned http://www.freeparking.co.nz/hosting/ So far IE7 and Opera have been rock-solid, but Firefox 1.5.11 has dropped on one PC and been ok on another, and I've seen one instance of dropping on IE6. (on a smaller monitor) The sizing is 69% + 3% + 27% (=99%) - how low do we need to go to avoid rounding errors? Hi Richard, - I don't know... On my 17 1024x768 screen at WinXP there are no droppings in FF2 and IE6. If window resized, all stays fine. But I notice in IE6, that the Google ad container is extended, and the bottom right corner doesn't fit. Screenshot http://home.tiscali.nl/developerscorner/css-discuss/images/freeparking-IE-corner.gif Also FF is overflowing the Google-img at 800x600, so I think cutting off the unneeded white space on the left right side of this img will help. Greetings, francky __ 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] Random float drops
Francky wrote: [...] ... overflowing Google img ... Sorry, I was too fast: didn't look at earlier replies before to write. It was already noticed and the same solution was given too. frnacky __ 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] IE7 special code
On 3/23/07, david [EMAIL PROTECTED] wrote: Barney Carroll wrote: david wrote: Or avoid a bunch of hacks and just use conditional comments to feed IE7 what it needs. I'm surprised no one has mentioned this yet! Quite refreshing, innit? I think it's because conditional comments aren't CSS. Increasingly I find more people find it more important to maintain honestly valid HTML than CSS - as long as the markup is sparkling, the horrors underneath can twist and turn to accommodate whatever will eat them. CSS is a powerful thing, but it is intended to work with valid HTML (as the W3C CSS validator reports). Clean, basic HTML avoids problems. And conditional comments don't interfere with that at all. I think it's disingenuous to call conditional comments clean, basic HTML. We all want to do beautiful, cross-platform, futureproof page layouts using semantic, accessible markup; unfortunately user agents are currently not quite up to the job (and, much as I love it, I have to include Firefox in this). So we hack; or, less pejoratively, we work around known issues with the user agents we're given - counting our blessings that we live in 2007 and not 1997. Whether we hack the CSS, the HTML or a bit of both is a matter of personal choice (personally I'm with Barney on this) - but call it what it is and don't try to pretend to purity. Chris -- Chris Ovenden http://thepeer.blogspot.com Imagine all the people / Sharing all the world __ 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] image replacement with links in IE
Ingo Cao wrote: Hi Brian, Do you have, or can you make something to put on a public server for us to look at? Just to show us the HTML you use and the effect you are trying to achieve? Right. You can see the design at www.semprinirecords.com This is a link to a page where the problem does not show up. Correct you are. The link points to the site as it exists now, with image elements inside anchors. I'd like to bring the site up to date by using image replacement on links inside list items. David had asked to see the *design* on the off chance that i could use something other than 24-bit PNGs. I thought that was clear. Anyway, links are not clickable when placed above a filter in IE. Worse, if placed above a filter when positioned. Both situations are adressed here: http://www.satzansatz.de/cssd/tmp/alphatransparency.html This looks interesting. I started to write up some JS to fiddle with the links for IE. I can alter it to add a span or something and see if that works (all the links are positioned absolutely). I'll check it out later this afternoon. thanks, brian __ 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/
[css-d] perfect font sizes- any sample solutions?
I, too, am struggling with the issue of optimum font sizes in css and would love to know if anyone has hit on keyword or em solution they are happy with? My goal is for everything to be resizeable and so I need to avoid pixels, obviously. Currently, my solution is body medium h1-3 medium weight 600 footer small (and then let everything inherit) I didn't realize about the IE problem with resizing too small. Anyway, any thoughts on what works with ems or keywords so that everything is resizeable would be interesting to me. thanks! __ 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] IE7 special code
From: david CSS is a powerful thing, but it is intended to work with valid HTML (as the W3C CSS validator reports). Clean, basic HTML avoids problems. And conditional comments don't interfere with that at all. From: Chris Ovenden I think it's disingenuous to call conditional comments clean, basic HTML. We all want to do beautiful, cross-platform, futureproof page layouts using semantic, accessible markup; unfortunately user agents are currently not quite up to the job (and, much as I love it, I have to include Firefox in this). So we hack; or, less pejoratively, we work around known issues with the user agents we're given - counting our blessings that we live in 2007 and not 1997. Whether we hack the CSS, the HTML or a bit of both is a matter of personal choice (personally I'm with Barney on this) - but call it what it is and don't try to pretend to purity. Very insightful! At first I was taken aback by the word disingenuous, until I realized you probably didn't mean its usual connotation of cynical, calculating, and insincere. :-) It's not surprising that I'd be confused by a word where Dictionary.com complains: The meaning of disingenuous has been shifting about lately, as if people were unsure of its proper meaning... http://dictionary.reference.com/search?q=disingenuous -Mike (not the language police, just want to make sure no one takes offense at something you didn't intend) __ 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] perfect font sizes- any sample solutions?
[EMAIL PROTECTED] wrote: I, too, am struggling with the issue of optimum font sizes in css and would love to know if anyone has hit on keyword or em solution they are happy with? Your question has already been answered. Read the thread. ~dL -- 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] perfect font sizes- any sample solutions?
Your question has already been answered. Read the thread. ~dL I did. __ 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] perfect font sizes- any sample solutions?
[EMAIL PROTECTED] wrote:
Your question has already been answered. Read the thread.
~dL
I did.
Using em's to set fonts:
html {font-size: 100%;}
body {font-size: 1em;}
and set individual selectors in em.
Regards,
~dL
--
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] perfect font sizes- any sample solutions?
On Mon, 26 Mar 2007, ~davidLaakso wrote:
html {font-size: 100%;}
body {font-size: 1em;}
and set individual selectors in em.
Does that really summarize the collective wisdom? Logically, setting font
size to 100% or 1em is equivalent to not setting it all, assuming that no
other style sheet sets it. Due to browser bugs, they might matter. But is
this really relevant nowadays?
Moreover, why 100% in one rule and 1em in another? That sounds like
invoking _both_ the bugs in % implementation _and_ the em bugs.
As far as I know, there are fewer bugs with % than with em, though this is
of course difficult to measure.
So why not just set in % for anything that should be relatively sized, and
not set html or body size at all?
--
Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/
__
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] perfect font sizes- any sample solutions?
I use the following and all browsers seem to render font sizes to what would
usually be a 13px height:
body{
font-family:Arial, Helvetica, sans-serif;
font-size:82%;
}
Only IE5.x screws up rendering text in tables cells so I add the rule:
table {
font-size:100%; /* Needed for IE5.x */
}
I then use either % or em for inividual rules (which ever suits my purpose).
For example font-size:85% will always generate a font size of 11px in all
browsers. Since I use the same CSS I never have to experiment with different
values to get different text sizes.
Kieron McIntyre
-
Email sent from www.virginmedia.com/email
Virus-checked using McAfee(R) Software and scanned for spam
__
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] perfect font sizes- any sample solutions?
[EMAIL PROTECTED] wrote: Anyway, any thoughts on what works with ems or keywords so that everything is resizeable would be interesting to me. Resize everything, or just the text? Thoughts don't help here since those browsers won't listen to anything but commands they understand, and I have no idea what you are trying to achieve - apart from resizing. The above isn't an attempt on making your questions look silly, as trying to achieve reliably resizing across browser-land is serious enough. However, I can think of many combinations that works - depending on what kind of layout they are supposed to work in, so more definitive answers can only be given when the design/layout conditions are known. --***--- Discussion about font-size and resizing tend to go up in flames, simply because each person has his/hers own opinions on the subject. So, let's avoid that and establish some facts instead. That's why we also need to know the conditions. --***--- What works every time and for every web designer, is to know about _all_ resizing options in any and all browsers one care to support. Most browsers can resize fonts (etc.) in more than one way, and they don't follow the same strategy. The next step is to test with _every_ combination of resize options in _all_ those browsers, until you are satisfied with the result. Again, don't expect the _same_ results across browser-land, so you may have to define for yourself what is good enough in each of them. Then - if the range of expected or invited visitors can be expected to have deviating preferences and/or needs relative to yours (something that is highly likely), you may also take some time off and learn something about those deviations so you are sure your final product can take a reasonable part of the stress. You have to define what reasonable means here. --- The bottom line is: don't ask others what works in general. Instead you yourself should test and find out what works and how it works - for you and your designs. It is of course equally important to find out what doesn't work and why it doesn't work for you and your design. Here are some links to help you along... http://www.gunlaug.no/contents/wd_1_03_02.html http://www.gunlaug.no/contents/wd_1_03_04.html http://www.gunlaug.no/contents/wd_additions_13.html ...and I'm happy with the knowledge I put in there as it was at the time I put it in, and the solutions I have derived from it. Nothing is static, so you may find a few changes and variations in later browsers and updated sites. None of them have made me consider changing my general strategy during the last couple of years though. --- General font sizing strategy at my end is as follows: Base (html and, body or a suitable container further in)... font-size: 100% (or larger - never smaller). Headlines (h1 - h5)... font-size: in a suitable percentage *or* em. Details (like footer-text)... font-size: 82% or .82em (or something of that nature). All containers and other elements inherit base-value = 100%. Then I test - as mentioned above, and adjust details until I'm satisfied with the result across browser-land. Rarely any surprises or need for adjustments at this stage, but I go through full testing anyway. See those pages I've linked to to see what I test for. Note that you won't find a 'font-size keyword' anywhere in my stylesheets - unless it is specifically added for testing-purposes. That's a personal choice, but also that I can do without corrections needed for some older browsers. Note also that I haven't found any real weaknesses with percentage as font-size base and em/percentages further in, since Opera 7.2 had its one size larger behavior. Later Opera versions have behaved fine. regards Georg -- http://www.gunlaug.no __ 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] perfect font sizes- any sample solutions?
Jukka K. Korpela wrote:
On Mon, 26 Mar 2007, ~davidLaakso wrote:
html {font-size: 100%;}
body {font-size: 1em;}
and set individual selectors in em.
Does that really summarize the collective wisdom? Logically, setting font
size to 100% or 1em is equivalent to not setting it all, assuming that no
other style sheet sets it. Due to browser bugs, they might matter. But is
this really relevant nowadays?
Moreover, why 100% in one rule and 1em in another? That sounds like
invoking _both_ the bugs in % implementation _and_ the em bugs.
As far as I know, there are fewer bugs with % than with em, though this is
of course difficult to measure.
So why not just set in % for anything that should be relatively sized, and
not set html or body size at all?
Exactly. I've never understood why some people set a base font size in
percentages, and then duplicate it with ems. I set a base font size in a
percentage, then use percentages throughout to size other elements
relative to that base. Of course, the base is going to be different for
every user because they have different defaults, but that's ok. My sites
are made to handle a good degree or font and window resizing.
Zoe
--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu
__
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] perfect font sizes- any sample solutions?
Hi,
It's amazing how much companies spend to just make web developers lives as
difficult as possible?
IE has a problem in resizing, ems, and even after you've set the body tag,
you will need to set it for any:
tables, select, input. Also be aware that Safari sets it's default to
14px;, which really helps.
I'm trying these with some success:
html
{
font-family:;
font-size:100% ;/***for IE/
}
body
{
font-family:;
font-size:1em; /***sets font in un-altered browsers to 16px, Times New
Roman***/
htmlbody
{
font-size: 16px; /***IE can't read this so it sets Safari to default
16px***/ (I hope)
then if using forms:
select {
font-family:;
font-size:100%; /***for IE***/
}
and the same for submit.
I offer no guarantees, but from all the information I can find this is it,
far short of using % for everything, tried that and it's very difficult, and
way-ward in alignment.
DG)
--
__
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/
[css-d] Safari miscalculating bottom for absolute positioning
I'm not a Mac user, so I'm not skilled at debugging problems in Safari
and am wondering if some of the Mac CSS gurus can help me. I have a
footer div, relatively positioned, that contains two anchor elements
which are absolutely positioned to appear on its bottom. This works
everywhere except Safari. Safari adds a great deal of space below the
footer and positions the anchors at the bottom of the page.
The space is not filled with the background color of the footer div, so
I know Safari is not extending the height of the footer div.
Also, if I change the bottom value to a top value, the anchors do sit at
the top of the footer, so I know it is not a case of them not
recognizing that they ought to be positioned in regards to the footer
div and not the body.
If I change the font size, the gap between the bottom of the footer and
the anchors widens or contracts accordingly. I'm not sure what this
means, but it's another clue, perhaps.
The bug occurs on every page of this site:
http://www.hsrc.unc.edu
Here's the CSS for the footer and its child elements.
#footer {
position: relative;
clear: both;
padding-top: 1px;
background: #e1eef0 url(../images/footer_bg.jpg) repeat-x;
font-size: 90%;
}
#footer p {
margin: 0;
margin-top: -8px;
padding: 20px 80px 10px 58px;
background: url(../images/footer_swoosh.gif) no-repeat;
}
#contact-btn {
position: absolute;
bottom: 0;
right: 75px;
width: 70px;
}
#sitemap-btn {
position: absolute;
bottom: 0;
right: 10px;
width: 57px;
}
As I said, I'm not an experienced Safari debugger, so I'm not sure what
I should even try in order to squash this bug. The only thing I tried
was giving the 0 values a unit, 0px, but that didn't work. I don't have
any other ideas.
Thanks,
Zoe
--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu
__
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] perfect font sizes- any sample solutions?
Hi, I would like to make one final comment. I thought css was suppose to make life easier. (Don't get me wrong I wouldn't go back to tables for a big stick). But nothing prepared me for the browser wars that have emerged with css, the old html never gave rise to as many problems, (at least no to my knowledge [maybe ignorance was bliss for me]). P_S Take my advice and listen to Georg. Plus the others on this list, you wont find many people who can/will help you more... DG) - __ 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] perfect font sizes- any sample solutions?
Exactly. I've never understood why some people set a base font size in percentages, and then duplicate it with ems. I set a base font size in a percentage, then use percentages throughout to size other elements relative to that base. Of course, the base is going to be different for every user because they have different defaults, but that's ok. My sites are made to handle a good degree or font and window resizing. Please bear with my ignorance, but when you say set a base font does that mean to set the rule for body to 100% ? __ 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] Safari miscalculating bottom for absolute positioning
Zoe,
the problem seems to be related to #project-areas and #latest-news.
Remove those two blocks and the problem goes away. As do the two
blocks. Of the two blocks it's #project-areas which is doing the most
damage. Try setting #project-areas p and #project-areas ul to
display: none to see what I mean.
I guess this is to do with fact that Safari somehow remembers the
height of the body element based on the dimensions of the elements
present at load time. I've seen this kind of thing happen when
removing elements with javascript and the same sort of thing seems to
be happening because of the absolutely positioned elements. I hadn't
seen this exact behaviour of yours before, but it certainly looks
like Safari is hanging on to its notion of where #footer starts
out...
The good news is that the nightly builds of WebKit do not display
this behaviour.
The way I work around this sort of thing at the moment is to target Safari
http://tanreisoftware.com/blog/?p=39#safari
so that the offending blocks are hidden and add a class onload so
that they get shown again. Not pretty, but the best I've been able to
come up with so far
http://www.fu2k.org/alex/css/cssjunk/hsrc
html[xmlns*=] body:last-child #project-areas, html[xmlns*=]
body:last-child #latest-news { display: none; }
html[xmlns*=] body.enabled:last-child #project-areas,
html[xmlns*=] body.enabled:last-child #latest-news { display: block;
Alternatively, put the button links inside a div (or similar) and
position those. Safari doesn't seem to get things quite so badly
wrong then.
__
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] Linked image showing style
Thanks Bradley! This worked fine. Thanks people for helping me work
this out . . .
Be well,
Kimi
At 1:17 PM +0100 3/25/07, Bradley Wright wrote:
It is the inline nature of the IMG that's making the BG colour shine
through.
Try this CSS:
.imgcenter a img {
display: block; /* removes background issues */
margin: 0 auto; /* centres image, as text-align will no longer
work */
}
--
Kim Brooks Wei
http://thewei.com
T 201.475.1854
__
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] perfect font sizes- any sample solutions?
Jukka K. Korpela wrote:
On Mon, 26 Mar 2007, ~davidLaakso wrote:
html {font-size: 100%;}
body {font-size: 1em;}
and set individual selectors in em.
Does that really summarize the collective wisdom? Logically, setting font
size to 100% or 1em is equivalent to not setting it all, assuming that no
other style sheet sets it. Due to browser bugs, they might matter. But is
this really relevant nowadays?
Moreover, why 100% in one rule and 1em in another? That sounds like
invoking _both_ the bugs in % implementation _and_ the em bugs.
As far as I know, there are fewer bugs with % than with em, though this is
of course difficult to measure.
So why not just set in % for anything that should be relatively sized, and
not set html or body size at all?
Sounds good to me.
Since some people prefer to set fonts using em's (for whatever reason
they may have), the above method avoids a bug in IE when doing so
Moreover, some might say, this thread has nothing to do with with the
mission of this list.
B est,
~dL
--
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] perfect font sizes- any sample solutions?
Moreover, some might say, this thread has nothing to do with with the mission of this list. I'm sorry, I don't understand why this is off-topic since it's about how css works. regards, karen __ 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] perfect font sizes- any sample solutions?
[EMAIL PROTECTED] wrote: Please bear with my ignorance, but when you say set a base font does that mean to set the rule for body to 100% ? Normally: yes. However, there are cases where a font-size declared on html and/or body is disturbing, so then the base font must be set on an element further in - maybe a wrapper-div just inside body, where _all_ children inherit it before we eventually give them their own font-size to make them smaller or larger than 100%. One such case is when I need to detect IE/win's own, internal, font-size with scripts, in order to write workarounds for one of its many weaknesses. Then I can't set font-size on html and/or body at all, or else I will only detect my own value. regards Georg -- http://www.gunlaug.no __ 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] Safari miscalculating bottom for absolute positioning
Alex Robinson wrote:
the problem seems to be related to #project-areas and #latest-news.
Remove those two blocks and the problem goes away. As do the two
blocks. Of the two blocks it's #project-areas which is doing the most
damage. Try setting #project-areas p and #project-areas ul to display:
none to see what I mean.
I guess this is to do with fact that Safari somehow remembers the
height of the body element based on the dimensions of the elements
present at load time. I've seen this kind of thing happen when
removing elements with javascript and the same sort of thing seems to
be happening because of the absolutely positioned elements. I hadn't
seen this exact behaviour of yours before, but it certainly looks like
Safari is hanging on to its notion of where #footer starts out...
Ah yes, that makes sense. It's probably due to the negative margin
technique this site uses that pulls the sidebar up into a hole (because
not just the home page displays it, and the other pages don't have those
two divs you mentioned).
The good news is that the nightly builds of WebKit do not display this
behaviour.
That is good. How often do updates to Safari come out?
The way I work around this sort of thing at the moment is to target
Safari
http://tanreisoftware.com/blog/?p=39#safari
so that the offending blocks are hidden and add a class onload so that
they get shown again. Not pretty, but the best I've been able to come
up with so far
http://www.fu2k.org/alex/css/cssjunk/hsrc
html[xmlns*=] body:last-child #project-areas, html[xmlns*=]
body:last-child #latest-news { display: none; }
html[xmlns*=] body.enabled:last-child #project-areas,
html[xmlns*=] body.enabled:last-child #latest-news { display: block;
Thanks. I'll consider doing this.
Alternatively, put the button links inside a div (or similar) and
position those. Safari doesn't seem to get things quite so badly wrong
then.
Yeah, I thought about doing this as well, but I hate mucking up the HTML
just to kill a bug that will go away soon. I'll take another look at it,
and my logs, and decide if it's really worth it to do anything or just
live with it.
Thanks,
Zoe
--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu
__
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/
[css-d] IE 7 Horizontal Scrollbars : Your opinion please
Hi there,
I have been trying to rid myself of unwanted horizontal scrollbars in
IE6 7, after a couple of hours I tried my last resort which was:
overflow: hidden; now is this permitted as valid css as it did indeed
fix my IE horizontal scrollbar problems.
#c-front-page #l-col {
float:left;
margin: 0;
padding: 0 0 0 15px;
width: 215px;
font-size:88%;
line-height:1.6em;
overflow: hidden;
}
#c-front-page #c-col {
float:right;
margin: 0;
padding: 0 15px 0 15px;
width:230px;
font-size:88%;
line-height:1.6em;
overflow: hidden;
}
--
Regards
Karl
__
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] Random float drops
On 3/26/07, ~davidLaakso [EMAIL PROTECTED] wrote: Richard Grevers wrote: Do Mac users have any problems with the updated page? There are 15 captures here http://www.browsercam.com/public.aspx?proj_id=334605. Fair warning if the client is a nit-picker like me who gets-off on pushing the envelope in XP :-) : Top-nav breaking at +1 (Firefox). Text-overlap on text-size largest when ignoring font-sixes (IE7.0) Text-overlap on text-size largest when ignoring font-sixes, and right column float-drop (IE6.0) Thanks David - and everyone else. It would have helped if I had comitted the change to the Google logo :-) Now that I have we are good down to 650px. The site is in-house, so the client is as picky as I want to be. Naturally I'm the only one who worries about accessibility. I do want to redo the masthead to make all the sizes em-based, but past experience shows there is a compromise needed between content-first (navigation positioned) layout and flexibility - which you usually hit when the navigation wraps. -- Richard Grevers, New Plymouth, New Zealand Hat 1: Development Engineer, Webfarm Ltd. Hat 2: Dramatic Design www.dramatic.co.nz __ 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/
[css-d] IE5/6 Bumps Down div
Here's my problem (and I'm sure the fix is embarrassingly simple): Page Location w/ css: http://65.18.148.2/temp.html Within FF, all is well. But IE5/6 takes the main div and bumps it down below the sidebar div. I've tried to clear but show my ignorance. How can I make main line up to the right of sidebar. Note: To avoid the box model hack, I've added a nested div. Thanks in advance! Duane Nelson Loss2gaiN Designs - A Website Development Company http://www.myl2g.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] perfect font sizes- any sample solutions?
[EMAIL PROTECTED] wrote: I'm sorry, I don't understand why this is off-topic since it's about how css works. It _is_ very much _on_ topic as long as we look at facts - CSS and browser behavior/bugs and how things work and/or don't. Interesting stuff that affects all designs. It may easily stray off topic if our own preferences get in the way of the facts, and that has happened all to often on the subject of font-size and resizing. regards Georg -- http://www.gunlaug.no __ 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] perfect font sizes- any sample solutions?
On Mon, 26 Mar 2007 18:38:44 +0100, [EMAIL PROTECTED] wrote:
I'm trying these with some success:
html
{
font-family:;
font-size:100% ;/***for IE/
}
body
{
font-family:;
font-size:1em; /***sets font in un-altered browsers to 16px, Times New
Roman***/
Not necessarily. I have unaltered IE7 and get a font-size of 20px
with those rules.
Reason: The unaltered factory setting for a high-definition laptop
(1440 x 1050) is 120 DPI. IE attempts to make the point size the
same as at 96 DPI with the extra pixels.
You are correct as far as Gecko-based browsers go. (16px.)
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/
[css-d] CSS menu oddness in IE7
Can someone help me figure out what is going on with the css menus on this site in IE7? I can't seem to figure it out. http://www.zencart137.jadetrue.com (grey menu up top) If you spend some time traveling through the menu, then hover off the menu mid-travel, then come back to it, some parts of the menu has hiding text, till you hover around some more. Ok, so that's a terrible explanation, but please test out and see if you can see the same behavior. This only seems to occur in IE (I've seen it in IE7, it may happen in earlier versions as well). Thanks for any suggestions! Jade True [EMAIL PROTECTED] __ 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] perfect font sizes- any sample solutions?
[EMAIL PROTECTED] wrote: I, too, am struggling with the issue of optimum font sizes in css and would love to know if anyone has hit on keyword or em solution they are happy with? My goal is for everything to be resizeable and so I need to avoid pixels, obviously. Currently, my solution is body medium h1-3 medium weight 600 footer small (and then let everything inherit) I didn't realize about the IE problem with resizing too small. Anyway, any thoughts on what works with ems or keywords so that everything is resizeable would be interesting to me. Why even set a font size on the body? Let it be at whatever the visitor has chosen for his or her preferred font size. Then use percentages for everything else. -- David [EMAIL PROTECTED] authenticity, honesty, community __ 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] IE5/6 Bumps Down div
On Mon, 26 Mar 2007 18:10:22 -0400, Duane Nelson wrote: Here's my problem (and I'm sure the fix is embarrassingly simple): A truism: It's so simple, once you know the way. Page Location w/ css: http://65.18.148.2/temp.html Within FF, all is well. But IE5/6 takes the main div and bumps it down below the sidebar div. I've tried to clear but show my ignorance. How can I make main line up to the right of sidebar. Note: To avoid the box model hack, I've added a nested div. Yes - that *should* work. But IE 5/6 is ornery, and needs a bit of breathing room. Your width: 527px + margin-left: 233px on #main is a bit too tight for that browser. I found that margin-left: 230px works nicely. Or a slightly wider #container. 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/
Re: [css-d] perfect font sizes- any sample solutions?
david wrote: [EMAIL PROTECTED] wrote: [...] Why even set a font size on the body? Let it be at whatever the visitor has chosen for his or her preferred font size. Then use percentages for everything else. O gentlemen and ladies, Read the thread, read the whole thread, and read not only the thread. :-) There are links given to good explaining pages why/when fontsizing the body , there are links to example pages... Otherwise, we will circle in circles. And as we know, circles are round (maybe except in IE). screenshot http://home.tiscali.nl/developerscorner/css-discuss/images/fontsize-thread.gif My 2 cts. ;-) francky __ 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] IE5/6 Bumps Down div
David Hucklesby wrote: Yes - that *should* work. But IE 5/6 is ornery, and needs a bit of breathing room. Your width: 527px + margin-left: 233px on #main is a bit too tight for that browser. I found that margin-left: 230px works nicely. Or a slightly wider #container. I shortened the width on #main. Thank you for the insight. I must remember to design less exact. Works well. Thank you very much!! Duane Nelson Loss2gaiN Designs - A Website Development Company http://www.myl2g.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] How to embed Flash movies?
On 3/24/07, Michael Stevens [EMAIL PROTECTED] wrote: I'm working on a site redesign at www.regencygarden.com/test/ and there are several pages there with Flash movies. They all validate XHTML 1.0 Strict except for the pages with the Flash. The validator doesn't like anything about the embed tag or the attributes therein. How do we embed these movies and stay strict? Now that the commercial browsers (MSIE and Opera) have had to implement click to activate barriers on flash controls, I consider Flash Satay to be outmoded, as it doesn't address this problem. Instead we use the swfobject javascript [1], which gives valid code, no click to activate and is pretty bulletproof. keep your alternative content small, as it is downloaded! [1] http://blog.deconcept.com/swfobject/ -- Richard Grevers, New Plymouth, New Zealand Hat 1: Development Engineer, Webfarm Ltd. Hat 2: Dramatic Design www.dramatic.co.nz __ 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] perfect font sizes- any sample solutions?
On 2007/03/26 17:13 (GMT-0700) David Hucklesby apparently typed:
On Mon, 26 Mar 2007 18:38:44 +0100, [EMAIL PROTECTED] wrote:
I'm trying these with some success:
html
{
font-family:;
font-size:100% ;/***for IE/
}
body
{
font-family:;
font-size:1em; /***sets font in un-altered browsers to 16px, Times New
Roman***/
Not necessarily. I have unaltered IE7 and get a font-size of 20px
with those rules.
Reason: The unaltered factory setting for a high-definition laptop
(1440 x 1050) is 120 DPI. IE attempts to make the point size the
same as at 96 DPI with the extra pixels.
To be clear, all IE versions default not to Xpx, but to 12pt. The M$ factory
default DPI is 96, which translates 12pt to 16px. OEMs (as do users) have
always been free to not retain the default 96 DPI for systems for which they
deem some other DPI more appropriate. With the proliferation of widescreen
laptops, particularly those models above WXGA (1280x800), have come a
widespread (if not predominant) OEM selection of 120 DPI, which translates
12pt to 20px. For some models, 144 DPI is actually more appropriate than
120, and at 144 DPI 12pt (CSS medium) is 24px.
--
For God did not send his Son into the world to condemn the
world, but to save the world through him. John 3:17 NIV
Team OS/2 ** Reg. Linux User #211409
Felix Miata *** http://mrmazda.no-ip.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] perfect font sizes- any sample solutions?
O gentlemen and ladies, Read the thread, read the whole thread, and read not only the thread. :-) There are links given to good explaining pages why/when fontsizing the body , there are links to example pages... Otherwise, we will circle in circles. And as we know, circles are round (maybe except in IE). It certainly is a complex issue; otherwise a simple solution for font sizing across browsers would be standard practice and nobody would need to write tutorials. I really have appreciated the discussion, though, because I've learned a *ton* from it and was planning to try to abstract the thread's points and suggested links tomorrow, fwiw... thanks for your forebearance! __ 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] perfect font sizes- any sample solutions?
On Mon, 26 Mar 2007, Felix Miata wrote: To be clear, all IE versions default not to Xpx, but to 12pt. The M$ factory default DPI is 96, which translates 12pt to 16px. I think it needs to be added that this correspondence (or some other correspondence that has been chosen) does not change when the monitor resolution is changed. Thus, if a user chooses a different resolution among the available options, 12pt will still be 16px. This means that pt will not match its definition any more; it will be different from the typographic point. Similarly, mm will be different from the physical millimeter and in different from the inch. The point (no pun intended) is that the physical units aren't really physical in all circumstances. Setting (or defaulting) something to 12pt may make it physically 12 typographic points in most circumstances, but not all. -- Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/ __ 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/
