Re: [css-d] overflow: auto elements receiving focus when tabbing
No, the question is not difficult to understand at all (the example provided is excellent) but it is not easy to answer, and as I've seen so far, not the easiest topic to research either. I also read most of the comments from #50 on and the only thing that appears to be clear-cut is that this is eaither a bug or how Firefox was intended to work. Of utmost interest is whether or not there are published Firefox specs that can be perused at will. I would think that would put this to rest right quick! Ralph - Original Message - From: Zoe M. Gillenwater [EMAIL PROTECTED] Date: Thursday, September 21, 2006 12:55 Subject: Re: [css-d] overflow: auto elements receiving focus when tabbing To: css-d@lists.css-discuss.org Mark J. Reed wrote: On 9/21/06, Zoe M. Gillenwater [EMAIL PROTECTED] wrote: Well, I agree with you, but that's hardly relevant. I dunno. Independently coming up with the same expectation goes toward the validity of that expectation . . . Not necessarily. Take margin collapsing, for instance. Almost no one would think it's intuitive until it was explained to them, and many still wouldn't agree with it. Just because we think elements with overflow: auto that don't actually overflow shouldn't receive focus when tabbing doesn't mean the standards writers or browser developers agree with us. In fact, the Firefox developers obviously don't! So again, I'm not interested in what people think should happen -- and that's not on-topic for this list -- but rather what really should happen. Or, as I said in my original email, I would like to know if this is something that no one has specified what should happen, and it's just completely up to the browsers (very possible). Firefox doesn't do what we think it should do, and my question, again, is whether it is correct for it to do what it is doing. Correct according to what, though? CSS doesn't even specify what user agents are supposed to do with overflow: auto; getting down to how keyboard shortcuts behave is way out of scope. Is there a formal spec for Gecko? Yes, the W3 specs. :-) Again, though, I've acknowledged that there may be no spec that specifies what a browser should do in this case, and thus it would be up to the browser to decide. I just want to know if this is or isn't the case. Does everyone finally understand my question? I didn't think it was that complicated. :-) 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 IE7b2 testing hub -- 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-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Help with floating bullets on a list
Ok ... I am sure I have seen this problem addressed somewhere but can't for the life of me find it. I want to have an image bullet float to within a few pixels to the left of a menu link. Here is a sample of what is happening and the css file. I would like for the check image to be a few pixels to the left of each menu / list item on hover but can't seem to make it happen. Can anyone help? Thanks! Ralph XHTML file: http://www.goobitron.com/test03.html CSS file: http://www.goobitron.com/test03.css __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Help with floating bullets on a list
Thank you! That was both elegant and simple. Works perfectly in Firefox and will be fine with a few minor adjustments in IE6. - Original Message - From: jennifer ham [EMAIL PROTECTED] Date: Thursday, September 14, 2006 17:10 Subject: Re: [css-d] Help with floating bullets on a list To: [EMAIL PROTECTED] [EMAIL PROTECTED] Cc: css-d@lists.css-discuss.org css-d@lists.css-discuss.org Here's what I did to make it happen: div#sitenav li { padding: 1px; margin: 1px; list-style: none; text-align:right; /* i added this */ } div#sitenav ul a { font-family: arial, sans-serif; color: #44; /* display: block; */ /* i removed this */ padding: 5px 5px 5px 45px; /* changed left padding to 45px */ margin: 0; line-height: 15px; font-size: .70em; text- decoration: none; text-align: right } Cheers! jennifer On 9/14/06, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Ok ... I am sure I have seen this problem addressed somewhere but can't for the life of me find it. I want to have an image bullet float to within a few pixels to the left of a menu link. Here is a sample of what is happening and the css file. I would like for the check image to be a few pixels to the left of each menu / list item on hover but can't seem to make it happen. Can anyone help? Thanks! Ralph XHTML file: http://www.goobitron.com/test03.html CSS file: http://www.goobitron.com/test03.css __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Need help with CSS behaviour
Greetings Everyone! It is at times like this that I am REALLY glad we have this list. I am a relative newcomer to CSS and have a couple of puzzling items that will no doubt be old hat to most of you so I ask your patience... I have created a site that I wish to be flly XHTML and CSS compliant and so far, so good. The site is pretty raw right now but the primary purpose is to convey information as opposed to looks, which I will work on later. I have validated the code and have tested it in IE6, FF, and Opera so far (I have no way to test on MAC or with older browsers so if someone can help there, they would earn my eternal gratitude). I used the vertical suckerfish menu technique almost line for line but most of the rest of the code except for hacks is my own doing (or undoing -- take your pick). Here are the issues: 1) When viewing the page in Opera, there is no vertical border on the right side of the yellow links. It works fine in FF and IE. Am I missing a hack or a coding tecnique here? 2) When I resize the font to a larger size, the right-most container rolls down/off. I am not sure of the best way to fix this. 3) I have always used px as my relative size, however, I tried to switch to em wherever possible for consistancy with the menu. Is it ok to mix relative size dimensions or should I try to use one or the other throughout? My eyes are a little blurry from looking at the code so I am hoping someone will recognize the problem from experience and help me out. The site in question is: http://www.advantagetennisfitness.com/testsite01 Thanks for your time and help, Ralph __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Need help with CSS behaviour
Ouch, I feel pretty stupid for not catching that one (the bug I created). I should tried dimensions of one genre exclusively before jumping into this combining them. I am just much more comfortable with px and most of the experts seem to prefer em. Maybe I can find a way to use em and think px. Seems that most references I consult discourage the use of px in favor of em. I did not know about the Opera bug and that should be easy one to fix/avoid in the future. Thanks for your help and off I go to make the changes. We'll see what transpires. Much appreciated! Ralph [EMAIL PROTECTED] wrote: http://www.advantagetennisfitness.com/testsite01 1) When viewing the page in Opera, there is no vertical border on the right side of the yellow links. It works fine in FF and IE. Am I missing a hack or a coding tecnique here? Opera does have a bug in that 'position: relative;' won't affect layer-level. FF doesn't have _this_ bug, and IE/win has its own bug that'll make it look just fine. However, you have created a bug of your own here. What you see is the result of putting a 10em+2px(border) wide link inside a 10em wide container. That container is still only 10em wide in all standard-compliant browsers, so the border is hidden behind the center-container in Opera. The easiest fix: #nav {display: table;} ...which will make the container expand in all good browsers, like it already does in IE/win. 2) When I resize the font to a larger size, the right-most container rolls down/off. I am not sure of the best way to fix this. That's what you get when em-width is mixed with px-width in layout. Better use either px or em for width, not both. You'll have to play with em and px on the outer containers/wrappers too, if you want them to adjust with their px/em dimensioned content. Pretty tricky CSS, but can be made to work. 3) See above. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Feasibly Managing Text Size and other stuff
Hello Everyone, This is my first post to any list of any kind so hopefully I did this right. While I have been perusing the list for sometime, I am a relative newby with respect to using CSS. I just developed my first XHMTL/CSS site have run into a couple of seemingly simple issues. I am sure I have seen the answers to at least one of these but cannot find the emails due to the prolific amount of traffic on this list so please bear with me if the subject has already been beat to death. 1) If the text size is set on the browser to be larger than medium, it completely breaks the site. Outside of using a fluid design, how do you manage this function? Would using a fixed type size (such as points) fix this? 2) I vaguely remember a thread regarding the overflow of background color from one div to another when the following div was an image (only in Firefox and Opera; IE6 displays it fine). Was this an inherence problem? Could someone guide me to an appropropriate reference source? 3) Not sure if this a CSS issue but it cannot hurt to ask. I use a small horizontal lined image for my main background and when the page expands to the point where the user has to scroll, it flickers something horribly. Again, I remember reading something about this problem but not sure if it was on this list or not. 4) Does anyone know where I can get an extensive test template for logging CSS testing? I would create one myself but am afraid I do not yet know enough and would miss some critical issues(especially from an assessability perspective). Thanks so much for your patience and help. If any one wishes to view an example of the above problem(s), please go to http://www.advantagetennisfitness.com/lessons. I left the CSS embedded for convenience. Ralph __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/