Re: [css-d] IE8 is better but still slightly broken
Alan Gresley wrote: Gunlaug Sørtun wrote: If a browser can't stack various layers of one element together in the right order on top of all layers of another element, without explicitly being told to group and stack element layers by using a nonsensical property/value for the case, then it is a serious stacking bug. I know the fix/bug. As I said previously this is deeper. Not deeper than how a rendering engine (all rendering engines) splits up and treats elements as a set of layers which are stacked in a certain order depending on rules - of which CSS takes part. The fact that we can fix this case doesn't help much either, since the missing hot-spot on an anchor is more like a symptom for something potentially much worse. We should be able to interact with - :hover on (amongst other things) - all elements, so a simple test should reveal if this is a general flaw or isolated to one element in IE8. Add something like this to any ordinary web page... html *:hover {color: red;} html * *:hover {color: green;} html * * *:hover {color: yellow;} ...and compare what part(s) of (the whole of) each element in the page reveals hot-spots. Compare with the results in latest versions of other major browsers, to see if IE8 deviates from the norm in any way. It shouldn't if they've gotten the element layering and stacking correct. I don't understand what you mean by How does it handle that filter if rolled back to IE7? I see that my band pass filter works. Toggle IE8 to render like IE7, and see how it handles such filters that are known to work in a certain way in IE7. Sorry Georg, remember that Ingo had to help me find that hidden blue arrow after I had replied to you. I didn't know what you meant. :-) That's ok Alan, it takes time to figure out an entirely new browser. I can relax and wait for answers, while piecing IE8 together in my head without having to do the work :-) Sorry Georg, but you are using a xml prolog like myself, and this is throwing IE8 into quirks mode. [...] I not completely correct here in a true sense since this can only happen when a comment appears between the xml prolog and doctype. Not quite unexpected... http://www.satzansatz.de/cssd/quirksmode.html ...and not really a problem. May change if they stop counting comments as source-code nodes in later betas and final though, so we should keep an eye on it. If IE8 doesn't emulate previous versions/modes *identical to* those previous versions/modes, the whole version target mess that has been the talk of the town lately, becomes utter nonsense in any order. [...] The perfect emulation of previous versions in all modes is essential, since any deviation means we'll have yet another version-set to go through and fix up while designing - and then another and yet another as new main IE-versions are released. That would be a disaster. 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/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Odd, broken design
On Thu, Mar 6, 2008 at 7:14 PM, Scott Sauyet [EMAIL PROTECTED] wrote: Thomas Francis wrote: Can anybody figure out why the quote on this page overlaps the footer near the bottom right-hand side? http://www.bris.ac.uk/news/2008/12017945171.html It's obviously not meant to do this and doesn't occur when the screen is really wide. Are you sure? It only happens for me when the screen is wide enough. Apologies, my mistake, you are correct. The reason is that the right-hand column (id: news-pic-quote-column) is absolutely positioned. That means that it is removed from the document flow. The clear: both on the footer doesn't apply to it. I'm not sure of the best solution, and don't have time to investigate the whole layout, but you might want to look at some floating solutions. Ok, thanks, that does seem to make sense (to me as an amateur CSS enthusiast!) I should have pointed out that the site belongs to my old university and I tend to use it quite a lot. And because I like to dabble in css/web design, I thought this was an unusual and interesting problem. Thanks for all replies. Thom -- Scott -- Regards Thom __ css-discuss [EMAIL PROTECTED] 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] Oldest Browser Currently Testing for
Rob Emenecker wrote: And remember this about logs: If you design a site that doesn't work in browser X, after awhile, you won't have anyone using browser X visit your site *because your site doesn't work.* Then you'll pat yourselves on the back and say, See - no one uses browser X. ;-) ... says the gentleman from Hawaii that supports the Lynx browser! I test with it, because it is a very good way to experience a site the way a visitor using a screenreader might. Or someone trying to use a site who can only navigate via keyboard due to motor control difficulties. But I'm not a person who'll ever be accused of being a kewl graphic designer. The principle is true of any browser, regardless of how old or new it might be. If you unnecessarily erect obstacles to visitors, they will turn away. They'll tell their friends about it. So their friends won't visit, either. And it spreads with each visitor you disappoint. -- David [EMAIL PROTECTED] authenticity, honesty, community __ css-discuss [EMAIL PROTECTED] 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] td widths change with img ???
Maybe a dumb question, but is the text in column (2) defined to be left aligned? Other than that, I cannot think of a reason - if all table rows are in one table and not in separate ones - why that should happen. Could you provide a link to an exemplary page showing your problem? Does it happen only in certain browsers? Regards, Christian *Directmedia Publishing GmbH* · Möckernstraße 68 · 10965 Berlin www.digitale-bibliothek.de AG Berlin-Charlottenburg · HR B 58002 · USt.Id. DE173211737 Geschäftsführer: Ralf Szymanski · Erwin Jurschitza Mike Schleif schrieb: I have dynamically generated tabular data. The leftmost cell in each row will be either an image, or blank. The images can vary in width. Height is not an issue. The displayed images are to be maximum width 150px. I would prefer that smaller images remain smaller; but, can live with stretch. Most irritating problem is that text in column (2) does NOT left justify in a straight vertical line ; Table cell border is ONLY for testing: td class=MenuPicture style=border: solid black 1px; width=180 px div class=Image img src=/modules/displaythumb.aspx?id=%= modID % / /div /td Current CSS: .Image { margin-bottom: 0px; margin-top: 0px; padding: 0px; text-align: center; width: 100%; } .MenuPicture { /* align: absmiddle; border-style: none; padding: 0px; text-align: center; */ } What am I missing? __ css-discuss [EMAIL PROTECTED] 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/ __ css-discuss [EMAIL PROTECTED] 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] a picture with in a picture
Jim Davis wrote: On Thu, Mar 6, 2008 at 6:57 PM, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Is it possible to have an image showing a picture frame and have that as part of the css style sheet. Here is a way to have the frame in as a background in the css and adding the image in the body of the html: http://www.jimdavis.org/test/frame_demo.html Or a similar technique with no additional markup: http://scott.sauyet.com/CSS/Demo/Frame/ Either method works only with fixed-size images. Techniques that use some sort of textured image to make a pseudo-frame are possible, but they will require additional containers in the markup, either included in the source or added by Javascript. -- Scott __ css-discuss [EMAIL PROTECTED] 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] td widths change with img ???
* Christian Kirchhoff [EMAIL PROTECTED] [2008:03:07:10:51:12+0100] scribed: Maybe a dumb question, but is the text in column (2) defined to be left aligned? Other than that, I cannot think of a reason - if all table rows are in one table and not in separate ones - why that should happen. Could you provide a link to an exemplary page showing your problem? Does it happen only in certain browsers? Go here: http://hb.platinumaire.net/form_4.aspx Enter this string: {A8D5CDDA-972F-4D33-A7E8-B5342AAE1350} and submit. So far, ff 2.0.0.12 and ie 7 both exhibit bad column alignment ... What do you think? -- Best Regards, mds mds resource 877.596.8237 - Dare to fix things before they break . . . - Our capacity for understanding is inversely proportional to how much we think we know. The more I know, the more I know I don't know . . . -- signature.asc Description: Digital signature __ css-discuss [EMAIL PROTECTED] 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] Oldest Browser Currently Testing for
I agree with everything your saying David. I was simply having one of those crap-tacular days and was trying to inject some witty sarcasm into the thread. It wasn't meant as a 'poo poo, why do you worry about that old text browser?' comment. The exact opposite is true, we should worry about it for the very reasons you state. __ css-discuss [EMAIL PROTECTED] 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] td widths change with img ???
Mike Schleif wrote: Go here: http://hb.platinumaire.net/form_4.aspx Enter this string: {A8D5CDDA-972F-4D33-A7E8-B5342AAE1350} and submit. The server is throwing errors when I try this. Do you have a spot to post just a static copy of the page in question? -- Scott __ css-discuss [EMAIL PROTECTED] 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/
[css-d] Two-column layout with sticky footer.
Okay, I swear I've done this a thousand times, and seen it ten thousand, but I've having problems with a straightforward layout problem. I'm wondering if anyone has a similar layout laying around... I'm looking for a two-column layout. The left (#nav) column should be fixed width and the right (#main) one fluid. I'd like to have a footer that sticks to the bottom of the viewport or the bottom of the document, whichever is lower. And I'd like the main content to come before the nav in the source. I can even live without the sticky footer as long as it's below both columns (either of which could be longer.) This shouldn't be hard, right? -- Scott __ css-discuss [EMAIL PROTECTED] 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] Two-column layout with sticky footer.
Scott Sauyet schrieb: Okay, I swear I've done this a thousand times, and seen it ten thousand, but I've having problems with a straightforward layout problem. I'm wondering if anyone has a similar layout laying around... I'm looking for a two-column layout. The left (#nav) column should be fixed width and the right (#main) one fluid. I'd like to have a footer that sticks to the bottom of the viewport or the bottom of the document, whichever is lower. And I'd like the main content to come before the nav in the source. I can even live without the sticky footer as long as it's below both columns (either of which could be longer.) This shouldn't be hard, right? -- Scott __ css-discuss [EMAIL PROTECTED] 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/ Maybe this helps: http://www.satzansatz.de/cssd/companions.html Not sure about your demands of letting the content come first though... Regards, Christian Kirchhoff *Directmedia Publishing GmbH* · Möckernstraße 68 · 10965 Berlin www.digitale-bibliothek.de AG Berlin-Charlottenburg · HR B 58002 · USt.Id. DE173211737 Geschäftsführer: Ralf Szymanski · Erwin Jurschitza __ css-discuss [EMAIL PROTECTED] 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] Two-column layout with sticky footer.
Scott Sauyet wrote: I'm looking for a two-column layout. The left (#nav) column should be fixed width and the right (#main) one fluid. I'd like to have a footer that sticks to the bottom of the viewport or the bottom of the document, whichever is lower. And I'd like the main content to come before the nav in the source. -- Scott In addition to what has already been suggested, you might try: Any two column content first source order layout of your choice on this page: http://blog.html.it/layoutgala/ with a faux-column: http://www.alistapart.com/articles/fauxcolumns/ and a footerStickAlt: http://www.themaninblue.com/writing/perspective/2005/08/29/ Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] 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/
[css-d] Targeting IE8 (was: IE8 is better but still slightly broken)
I'm curious as to why you're targeting various IEs with hacks when conditional comments let you do the same thing? Especially if the hacks are used to import external sheets in the first place, it seems to me it's easier to just use CCs to load browser-specific fix-up sheets in the first place. Mark R -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Alan Gresley Sent: March 6, 2008 18:57 To: [EMAIL PROTECTED] Cc: css-d@lists.css-discuss.org; 'Bruno Fassino'; [EMAIL PROTECTED] Subject: Re: [css-d] IE8 is better but still slightly broken Thierry Koblentz wrote: I agree with Nick here. The band pass filter will be fixed in later beta. Currently I think you can use this approach (untested). imho, the fact that the band pass filter will be fixed or not is irrelevant, because in any case I won't have anything more to do. It is working *now* and it will be working tomorrow. Why should I leave that page broken when I know there is an easy, *safe* and quick fix? -- Regards, Thierry | http://www.TJKDesign.com You are correct in once sense and that why I suggested the import method to separate all versions of IE. Remember hacking IE8 to render correctly hides the bugs in the first place. I have many broken pages because IE8 is using my IE7 targeting hacks. Now I have to remove all these hacks from my main style sheet and now feed IE7 it's style via invalid import hacks. I don't know what hacks you have used Thierry but I do understand what I must do for my site but certain pages must remain broken to support any test cases that I do prepare. I not saying not to hack for IE8. I was just showing a way of using the band pass filter to feed IE8 the correct style with either broken or unbroken rendering. I myself will let IE8 render however it decides to render. Alan http://css-class.com/ __ css-discuss [EMAIL PROTECTED] 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/ __ css-discuss [EMAIL PROTECTED] 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] Two-column layout with sticky footer.
Wow. Sorry Scott - you'll be getting this twice! I keep forgetting when I hit reply to this list, it only replies to the original person - not the whole list. I wanted to re-send because I thought this might help someone else looking for the same thing - otherwise I wouldn't bother. I just did this *exact* layout for a client the day before yesterday. You can get the vanilla version here: http://brassblogs.com/templates/2col.stickyfoot.leftsidebar/ I also have a right-sidebar version. (I think I have a 3-column version too...somewhere...hmm...where'd I put that...) ~Shelly __ css-discuss [EMAIL PROTECTED] 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] Two-column layout with sticky footer.
[EMAIL PROTECTED] wrote: I wanted to re-send because I thought this might help someone else looking for the same thing - otherwise I wouldn't bother. I just did this *exact* layout for a client the day before yesterday. You can get the vanilla version here: http://brassblogs.com/templates/2col.stickyfoot.leftsidebar/ This is pretty close to what I'm looking for. The only thing I see missing is that the main column is supposed to be fluid. I might play around with altering it. Thanks for your help, -- Scott __ css-discuss [EMAIL PROTECTED] 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] Two-column layout with sticky footer.
David Laakso wrote: Scott Sauyet wrote: I'm looking for a two-column layout. The left (#nav) column should be fixed width and the right (#main) one fluid. I'd like to have a footer that sticks to the bottom of the viewport or the bottom of the document, whichever is lower. And I'd like the main content to come before the nav in the source. In addition to what has already been suggested, you might try: Any two column content first source order layout of your choice on this page: http://blog.html.it/layoutgala/ I'd seen that before, but hadn't bookmarked it. I think Layout 24 might do what I need. Thanks. with a faux-column: http://www.alistapart.com/articles/fauxcolumns/ I know the technique, but it's not needed for this project. and a footerStickAlt: http://www.themaninblue.com/writing/perspective/2005/08/29/ Yes, and there are others techniques at http://css-discuss.incutio.com/?page=FooterInfo including an ancient one of my own. Thanks for your help. -- Scott __ css-discuss [EMAIL PROTECTED] 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] td widths change with img ???
* Scott Sauyet [EMAIL PROTECTED] [2008:03:07:08:59:00-0500] scribed: Mike Schleif wrote: Go here: http://hb.platinumaire.net/form_4.aspx Enter this string: {A8D5CDDA-972F-4D33-A7E8-B5342AAE1350} and submit. The server is throwing errors when I try this. Do you have a spot to post just a static copy of the page in question? -- Scott http://hb.platinumaire.net/test.html -- Best Regards, mds mds resource 877.596.8237 - Dare to fix things before they break . . . - Our capacity for understanding is inversely proportional to how much we think we know. The more I know, the more I know I don't know . . . -- signature.asc Description: Digital signature __ css-discuss [EMAIL PROTECTED] 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] td widths change with img ???
Hello, A look at your html code shows me that the rows are in separate tables. For a start try to combine evrything in one single table by dropping the extra: /table table cellpadding=5 cellspacing=5 width=100% in between the four rows. Otherwise: Try setting width: 180px; for .Image, and set the cellpadding attribute of the table tags to 0. Best regards, Christian Kirchhoff *Directmedia Publishing GmbH* · Möckernstraße 68 · 10965 Berlin www.digitale-bibliothek.de AG Berlin-Charlottenburg · HR B 58002 · USt.Id. DE173211737 Geschäftsführer: Ralf Szymanski · Erwin Jurschitza Christian Kirchhoff schrieb: Maybe a dumb question, but is the text in column (2) defined to be left aligned? Other than that, I cannot think of a reason - if all table rows are in one table and not in separate ones - why that should happen. Could you provide a link to an exemplary page showing your problem? Does it happen only in certain browsers? Regards, Christian *Directmedia Publishing GmbH* · Möckernstraße 68 · 10965 Berlin www.digitale-bibliothek.de AG Berlin-Charlottenburg · HR B 58002 · USt.Id. DE173211737 Geschäftsführer: Ralf Szymanski · Erwin Jurschitza / __ css-discuss [EMAIL PROTECTED] 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] td widths change with img ???
* Christian Kirchhoff [EMAIL PROTECTED] [2008:03:07:18:11:45+0100] scribed: Hello, A look at your html code shows me that the rows are in separate tables. For a start try to combine evrything in one single table by dropping the extra: /table table cellpadding=5 cellspacing=5 width=100% in between the four rows. snip / When I read this, I thought, No way! I didn't do something that bad ; However, when I checked the code; sure enough, my bad, I had done the dork ; Thank you, thank you, thank you ... -- Best Regards, mds mds resource 877.596.8237 - Dare to fix things before they break . . . - Our capacity for understanding is inversely proportional to how much we think we know. The more I know, the more I know I don't know . . . -- signature.asc Description: Digital signature __ css-discuss [EMAIL PROTECTED] 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] IE8 is better but ... X-UA-Compatible response header
Setting the X-UA-Compatible response header has some aspects I find remarkable. meta http-equiv=X-UA-Compatible content=IE=6 or meta http-equiv=X-UA-Compatible content=IE=5 ... - content=IE=5 or content=IE=6 throws IE8b1 in quirksmode, even if the document has a standards Doctype. while - content=IE=8 or content=IE=9 ... throws IE8 in Standards-IE8-Mode, even if there is /no/ doctype (or a quirksmode triggering doctype). and - content=IE=7 throws IE8 in Standards-IE7-Mode, even if there is /no/ doctype (or a quirksmode triggering doctype). Other content like IE=4 or IE=nonsense keeps IE8 in Standards-IE8-Mode if there is a standards doctype, so I think they are simply ignored. But IE=5 or IE=6 are not ignored, they have a meaning that is not documented yet afaik. So the meta-switch is able to take precedence over the doctype switch in any case. Ingo -- http://www.satzansatz.de/css.html http://www.dolphinsback.com __ css-discuss [EMAIL PROTECTED] 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] IE8 is better but ... X-UA-Compatible response header
So the meta-switch is able to take precedence over the doctype switch in any case. Definitely! That's by design. Doctype switching will continue to work as usual; you can choose between Quirks (IE5.5) and Standard (IE8). However, any meta switch will ALWAYS overrule any doctype. Setting the X-UA-Compatible response header has some aspects I find remarkable. meta http-equiv=X-UA-Compatible content=IE=6 or meta http-equiv=X-UA-Compatible content=IE=5 ... - content=IE=5 or content=IE=6 throws IE8b1 in quirksmode, even if the document has a standards Doctype. while - content=IE=8 or content=IE=9 ... throws IE8 in Standards-IE8-Mode, even if there is /no/ doctype (or a quirksmode triggering doctype). and - content=IE=7 throws IE8 in Standards-IE7-Mode, even if there is /no/ doctype (or a quirksmode triggering doctype). Other content like IE=4 or IE=nonsense keeps IE8 in Standards-IE8-Mode if there is a standards doctype, so I think they are simply ignored. But IE=5 or IE=6 are not ignored, they have a meaning that is not documented yet afaik. Ingo -- http://www.satzansatz.de/css.html http://www.dolphinsback.com __ css-discuss [EMAIL PROTECTED] 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/ -- --- ppk, freelance web developer http://www.quirksmode.org/ -- __ css-discuss [EMAIL PROTECTED] 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] IE8 is better but still slightly broken
Gunlaug Sørtun[EMAIL PROTECTED] Alan Gresley wrote: I know the fix/bug. As I said previously this is deeper. Not deeper than how a rendering engine (all rendering engines) splits up and treats elements as a set of layers which are stacked in a certain order depending on rules - of which CSS takes part. The fact that we can fix this case doesn't help much either, since the missing hot-spot on an anchor is more like a symptom for something potentially much worse. We should be able to interact with - :hover on (amongst other things) - all elements, so a simple test should reveal if this is a general flaw or isolated to one element in IE8. In my case it's one menu and the first generation of anchors. Since you not using IE8 I will give you visualization by using code view. div style=float: left ul style=float: left li style=float: left; position: relative ahover Text node only/a ul liahover Block/a/li /ul /li /ul /div div style=position:absolute ul style=float:left li style=float: left; position: relative ahover Block/a ul lia href=hover Block/a/li /ul /li /ul /div This is what meant by deeper, the position:absolute somehow helps with the correct staking of the anchor. And if a float is use instead we must use position:relative on the anchor. IE8 is the only browser that behaves this way but the following styles work the same way in all browsers Add something like this to any ordinary web page... html *:hover {color: red;} html * *:hover {color: green;} html * * *:hover {color: yellow;} http://css-class.com/articles/ursidae/bears5ddh-kbaccess.htm That's ok Alan, it takes time to figure out an entirely new browser. I can relax and wait for answers, while piecing IE8 together in my head without having to do the work :-) One thing good about IE8. It loads in a third of the time it took IE7 to load but using the developers tools for toggling sometimes cause the toggling to hang, and IE* must be reloaded. I find myself constantly looking up to see what mode I in and sometimes I not sure if it stuck in normal IE8 mode or IE7 mode. The fix again is to reload. Come Georg join the party, toggling is really fun when it work properly. :-) Sorry Georg, but you are using a xml prolog like myself, and this is throwing IE8 into quirks mode. [...] I not completely correct here in a true sense since this can only happen when a comment appears between the xml prolog and doctype. Not quite unexpected... http://www.satzansatz.de/cssd/quirksmode.html ...and not really a problem. May change if they stop counting comments as source-code nodes in later betas and final though, so we should keep an eye on it. Chris Wilson and Justin Rogers have already stated on the CSS WG list that this behavior will be removed in a later beta. The perfect emulation of previous versions in all modes is essential, since any deviation means we'll have yet another version-set to go through and fix up while designing - and then another and yet another as new main IE-versions are released. That would be a disaster. regards Georg Here a interesting dilemma while these hacks are still targeting IE8. For other listers apart from Georg, load this page initially in IE8 mode. http://css-class.com/test/css/selectors/ie7hacktargetingopera4.htm Only one red line selected by the * html hack. Now toggles into IE7 is see what changes. Now IE7 mode drop support for * html and now use these. *+html - target Opera 9.10 and 9.24 *~html - target Opera 9.10 and 9.24 and Opera 9.5 alpha *+*+html *~*~html Now try to toggle back into IE8 and notice that the same four hack are still red. No amount of toggling will change this. I not even sure if IE7 mode is actually reached since the background on the page header is called in by IE8 conditional comments. Alan http://css-class.com/ __ css-discuss [EMAIL PROTECTED] 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/
[css-d] Site check
If you guys wouldn't mind, could I get a site check on this? http://www.cgraytaylor.net It seems to check out okay for me in Firefox, IE 7, and Opera. I had to lower the font size in the gallery photo descriptions for Opera to lay out the text correctly which makes it a touch small for my tastes, but is better than having orphan words. It's my first CSS site, so some critiques would be much appreciated. Phoebe __ css-discuss [EMAIL PROTECTED] 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] a picture with in a picture
Thank-you all for the great collection of ideas. I'm going though them now and will let you know how it turns out. You have expanded my vision of what is possible though css. thank-you chris On 7-Mar-08, at 6:07 AM, T wrote: If you want an ornate frame, for example, where parts of it overlap the image, set the picture as the background image, then place the frame image over the top. For example, each page loads a different image. This is called image.jpg in the block below (just replace with your image name). div class=bg_image style=background-image: url(images/image.jpg); img src=images/frame.png ... / /div In your CSS: #bg_image { background-repeat: no-repeat; border: 0; /* Your frame IS the border*/ height: (however tall the frame is) px / em / %; width: (however wide the frame is) px / em / %; } Make sure the inside of the frame is transparent, so your background image will show through. This way, you can have a gallery style frame, with intricate patterns, gargoyles, or whatever, sticking into the picture area. I haven't tested this, but I don't see any reason why it shouldn't work. Use .png for the frame, cos it has excellent transparency support. Hope this works out for you, and I'd like to see it when it's done. Good luck -Original Message- From: [EMAIL PROTECTED] Sent: Thu, 6 Mar 2008 18:57:18 -0800 To: css-d@lists.css-discuss.org Subject: [css-d] a picture with in a picture Is it possible to have an image showing a picture frame and have that as part of the css style sheet. Then in HTML on different pages use that frame to cover over an image, giving the image a nice decorative picture frame. Don't know if I'm pushing the limits. thanks in advance chris __ css-discuss [EMAIL PROTECTED] 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/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check
If you guys wouldn't mind, could I get a site check on this? http://www.cgraytaylor.net It seems to check out okay for me in Firefox, IE 7, and Opera. I had to lower the font size in the gallery photo descriptions for Opera to lay out the text correctly which makes it a touch small for my tastes, but is better than having orphan words. It's my first CSS site, so some critiques would be much appreciated. Phoebe Hi Phoebe, One quick thing I saw was in the gallery. When the cursor rolls over the image, there is a slight jump when the the border around the image changes between 1px and 2px. .thumbnail img{ border: 1px solid white; margin: 0 5px 5px 0; } If you make the white border about the image 2px the jump should disappear. .thumbnail img{ border: 2px solid white; margin: 0 5px 5px 0; } Another little thing was (this is simply subjective on my part) the menu up top. A little more space between each item might be nice. Right now you have the following: #slantedmenu ul li{ display: inline; } #slantedmenu ul li a{ color: #494949; padding: 5px 0; padding-right: 35px; margin: 0; text-decoration: none; background-image: url(graphics/buttons/divider.jpg); background-repeat: no-repeat; background-position: right; } I would do the following to separate them a bit and make them easier to read. First, add a margin-right: 30px to the #slantedmenu ul li as such: #slantedmenu ul li{ display: inline; margin-right: 30px; } Then shrink the padding-right in #slantedmenu ul li a from 35px to 25px as such: #slantedmenu ul li a{ color: #494949; padding: 5px 0; padding-right: 25px; margin: 0; text-decoration: none; background-image: url(graphics/buttons/divider.jpg); background-repeat: no-repeat; background-position: right; } You could also combine the padding: 5px 0 and padding-right: 25px to a single line like this: padding: 5px 25px 5px 0; Just a thought. :) You've done a good job with your first sight. Be encouraged. Mark __ css-discuss [EMAIL PROTECTED] 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] Two-column layout with sticky footer.
http://brassblogs.com/templates/2col.stickyfoot.leftsidebar/ This is pretty close to what I'm looking for. The only thing I see missing is that the main column is supposed to be fluid. I might play around with altering it. Actually it's based off a fluid layout. If you remove the #wrapper, and the widths for header, footer and outer (and adjust #outer for the 100% height) the main column should become fluid at 100%. Alternatively, you could just set #wrapper, #footer, #header and #outer at 100% width, and you're set. ~Shelly __ css-discuss [EMAIL PROTECTED] 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] IE8 is better but still slightly broken
Alan Gresley wrote: http://css-class.com/articles/ursidae/bears5ddh-kbaccess.htm Sorry, no use for testing anything, since you've tailored it to only target the anchors - not every element in the page. I'll do deep testing of IE8' element-layer stacking and handling when I get around to download this, or another, beta, and run it through its phases. [...] Come Georg join the party, toggling is really fun when it work properly. :-) Toggling unfinished software between its broken stages, does not register under my definition of fun, I'm afraid ;-) Anyway, I now have a pretty good idea how this beta works, so I'll probably wait for the next one before doing serious testing. 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/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE8 is better but ... X-UA-Compatible response header
Ingo Chao wrote: - content=IE=5 or content=IE=6 throws IE8b1 in quirksmode, even if the document has a standards Doctype. The real IE5 and IE6 have many differences in their support and interpretation of CSS in quirks mode. Does IE8 reflect these differences - as the meta-number suggests? So the meta-switch is able to take precedence over the doctype switch in any case. Which is what has been indicated from the start, I think. It's just the default for no meta that has changed. 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/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check
Mark -- I increased the padding a little. Good tip to start combining the padding. I need to think making things more compact in the coding on future projects. I didn't increase it quite as much as you had. I'm thinking about adding a glossary of terms, especially for the folders, ie - what makes an orange blossom different than a lobster folder, so I'm conserving a little space for that future addition. Dwayne -- Actually, I'd like to eventually work with some sort of elastic layout, where it can expand to a certain point. I'm not sure I'm entirely comfortable with filling up all the browser real estate, but more would be nice, I agree. And no, haven't sold one of these to OJ, but have sold to a couple of Hollywood types, like directors. Is that as bad? Maybe they had someone knocked off in a movie or two? :) I have a couple of other folks that want a site done, so it looks like I'll be getting plenty of practice with this, and maybe picking up some extra cash, too. Yaay! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check
Phoebe Taylor [EMAIL PROTECTED] wrote: Dwayne -- Actually, I'd like to eventually work with some sort of elastic layout, where it can expand to a certain point. I'm not sure I'm entirely comfortable with filling up all the browser real estate, but more would be nice, I agree. Well... a little border space is fine... kind of like a photo in a frame with a border. That would certainly work with your layout. Best of luck with the endeavor! -- Servatis a periculum... Servatis a maleficum... http://dwacon.blogspot.com __ css-discuss [EMAIL PROTECTED] 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/
[css-d] X-UA-Compatible - discrepancies between targeted behaviour in IE8 and actual behaviour
http://www.fu2k.org/alex/css/cssjunk/ie8/xua In a nutshell, IE8's emulation of IE6 and IE5 does not appear to be off to a flying start. 1. Box model not honoured when targeting IE6 and in standards mode 2. Parsing errors not replicated when targeting IE5. Can someone confirm that the results show here are correct, or point out what I'm doing wrong? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check
Phoebe Taylor wrote: If you guys wouldn't mind, could I get a site check on this? http://www.cgraytaylor.net Phoebe Quick look: quick thoughts... One method of checking the structural integrity of a page is to set minimum font size of 24 or larger; and/or to test at +1, +2, or even +3 font-scaling. In checking your home page at +2 in Firefox, causes the content text to shoot out the bottom of the footer. You can correct this by deleting the height on #main. Justified text works well in some instances in print media. On the Web, it is seldom successful, as users have the ability to exercise their font size preferences. The rivers (typographers slang for the trailing gaps running down the content block) you see -- particularly when the fonts are scaled -- is correctable, if you choose, by deleting text-align: justify; from the p selector. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check
Phoebe Taylor wrote If you guys wouldn't mind, could I get a site check on this? http://www.cgraytaylor.net It seems to check out okay for me in Firefox, IE 7, and Opera. I had to lower the font size in the gallery photo descriptions for Opera to lay out the text correctly which makes it a touch small for my tastes, but is better than having orphan words. It's my first CSS site, so some critiques would be much appreciated. Phoebe: Welcome to CSS! I am using Win XP Home SP2. Very pleasing intial impression. FF2.0 looks good except for text growing out the bottom, per David Laakso. O9.26 looks good. Avant 11.5 looks good. IE8 beta looks good. Your fixed pixel fonts don't scale in IE/Avant. Personally, I would lose the Best viewed inor greater resolution That should be a user decision. An orphan /a tag is causing a few minor errors, per the W3C validator. Keep up the good work. Best Regards, Peter Hyde-Smith www.fatpawdesign.com __ css-discuss [EMAIL PROTECTED] 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/
[css-d] IE 6 ignores margin on statically positioned div; also, background drop-out.
This one's new to me: I don't recall IE6 messing up margins on a statically positioned container before, but this appears to be what I've got: http://weston.canncentral.org/web_lab/Arteis/MoboUbiq/ The box with the yellow border is the one I'm having trouble with. It's styled like so: #photosection { background-position: 50% 50%; margin: 11px; border: 1px solid yellow; } in the linked stylesheet, and then inline, I've given it style=background-image: url(images/Photo.jpg); height: 235px;. Moz and Safari seem to display it perfectly. IE6 appears to completely ignore the margin instructions. Just for fun, I've tried triggering hasLayout and assigning position: relative, but it doesn't seem to change anything. I have a brute force workaround in the form of wrapping another div around the div in question and giving that div padding, but I'm interested in seeing if anybody knows what in the world is going on here or has a better idea for solutions. Also, the orange bordered box farther down the page have another issue in IE6: the background-image applied to it doesn't start displaying until the content inside the div kicks in. The background isn't positioned in any way, and the border clearly shows the boundary of the box starts way above any ideas what could be happening here, too? Thanks, Weston __ css-discuss [EMAIL PROTECTED] 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] X-UA-Compatible - discrepancies between targeted behaviour in IE8 and actual behaviour
http://www.fu2k.org/alex/css/cssjunk/ie8/xua In a nutshell, IE8's emulation of IE6 and IE5 does not appear to be off to a flying start. IE8 cannot emulate IE6, only IE5 and 7. 1. Box model not honoured when targeting IE6 and in standards mode 2. Parsing errors not replicated when targeting IE5. Which parsing errors exactly? The IE team is looking for such bug reports right now, so a few test cases would help a lot. -- --- ppk, freelance web developer http://www.quirksmode.org/ -- __ css-discuss [EMAIL PROTECTED] 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/
[css-d] Mind the Gap: multi-level menu problem
Hello all, In developing this menu I have encountered a problem with a couple different implementations of the code. Everything look fine in Firefox, Opera, and Safari yet IE (6 and 7) displays a 2-pixel gap underneath the li whenever a second-level menu item contains and 3rd level menu. My menu: http://www.dangodang.com/projects/cssmenu/test_menu_3.html Ultimately the sub levels will only appear on mouse over. I've developed that advanced version and the gap only appears when the 3-level menu is visible. In other words, when the third level ul is set to 'display:none' no gap appears in the second level. Suggestions are most appreciated. Thank you, Ryan PS This code is custom although I borrowed a few ideas from CSS Play's really neat, css-only, drop-down example here: http://www.cssplay.co.uk/menus/final_drop.html __ css-discuss [EMAIL PROTECTED] 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] X-UA-Compatible - discrepancies between targeted behaviour in IE8 and actual behaviour
IE8 cannot emulate IE6, only IE5 and 7. WTF? So IE=6 is actually the same as IE=5. Genius. Of course, I believe you, but I'm having difficulty tracking down where Microsoft say this. Any pointers? 2. Parsing errors not replicated when targeting IE5. Which parsing errors exactly? The IE team is looking for such bug reports right now, so a few test cases would help a lot. In the example div#parsing { ... background: #ffcc00; backg\round: #006633; ... } Real IE5 colours the div yellow, emulated IE5 gets carried away and repaints it green. __ css-discuss [EMAIL PROTECTED] 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] IE8 is better but ... X-UA-Compatible response header
Gunlaug Sørtun wrote: Ingo Chao wrote: - content=IE=5 or content=IE=6 throws IE8b1 in quirksmode, even if the document has a standards Doctype. The real IE5 and IE6 have many differences in their support and interpretation of CSS in quirks mode. Does IE8 reflect these differences - as the meta-number suggests? Based on the Versioning and Internet Explorer Modes whitepaper, making the assumption that Microsoft just kept the old IE7 Quirks mode, it seems like we have four modes: IE7 Quirks (versions7), IE7 Standards (version=7), IE8 Standards (version =8) and Best possible (version=edge), with Best possible being the same as IE8 Standards in IE8. Copying the table from that whitepaper: Common Name New Compatibility Mode Value Quirks IE=5 IE7 Standards IE=7 IE8 Standards IE=8 Best possible mode IE=edge What was new to me was that the meta is able to trigger quirks mode. Thats probably not important, but I did not get this from Aaron Gustafson's beyonddoctype ALA article. Is there any technical paper out that informs about the meta and header? uri:http://code.msdn.microsoft.com/ie8whitepapers/Release/ProjectReleases.aspx?ReleaseId=569 -- David liorean Andersson __ css-discuss [EMAIL PROTECTED] 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] X-UA-Compatible - discrepancies between targeted behaviour in IE8 and actual behaviour
-Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] discuss.org] On Behalf Of Alex Robinson Sent: Friday, March 07, 2008 4:50 PM To: Peter-Paul Koch Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] X-UA-Compatible - discrepancies between targeted behaviour in IE8 and actual behaviour IE8 cannot emulate IE6, only IE5 and 7. WTF? I guess that's why Ingo said earlier: content=IE=5 or content=IE=6 throws IE8b1 in quirksmode, even if the document has a standards Doctype. -- Regards, Thierry | http://www.TJKDesign.com __ css-discuss [EMAIL PROTECTED] 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/
[css-d] Lines clipping in Explorer, and width issue
CSS-d, I have two issues in Explorer 7. If you look here, you can see how the page should look in the two Safari examples: http://www.browsercam.com/public.aspx?proj_id=411750 Please be forgiving on the style, as I'm still in the process of deciding placement and colour. In any case, in Safari (and FireFox), the page renders as I would expect. Problem one in Explorer is that the bottom line of the containing DIV is missing. I've never seen an effect like that before. There is maybe a general clipping effect happening, as I notice the links at the very top of the page are also missing their underlines. Problem two is that in XP with the screen size set to 1024x768, the rightmost item pink horizontally aligned menu gets bumped over to below the left side. This baffles me since it seems to display okay at 800x600 in the same browser and platform. Any help on these issues would be greatly appreciated. The CSS can be viewed here: http://jigsaw.w3.org/css-validator/validator?profile=css21warning=0uri=http%3A%2F%2Faimashou.jp%2Fhome_page Similarly, the HTML can be seen here: http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Faimashou.jp%2Fhome_page Thank you for your time and help. -- Dave M G Articlass - open source CMS http://articlass.org __ css-discuss [EMAIL PROTECTED] 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] X-UA-Compatible - discrepancies between targeted behaviour in IE8 and actual behaviour
IE8 cannot emulate IE6, only IE5 and 7. WTF? So IE=6 is actually the same as IE=5. Genius. Yup. In fact, I argued for the inclusion of IE=6 for consistency's sake. It pointing to IE5 is not perfect, but better than having something really weird happen when you use that value. Of course, I believe you, but I'm having difficulty tracking down where Microsoft say this. Any pointers? Not yet, but I'm 100% certain this is the case. 2. Parsing errors not replicated when targeting IE5. Which parsing errors exactly? The IE team is looking for such bug reports right now, so a few test cases would help a lot. In the example div#parsing { ... background: #ffcc00; backg\round: #006633; ... } Real IE5 colours the div yellow, emulated IE5 gets carried away and repaints it green. Duly noted. Don't know when I'll be able to send this on, though. -- --- ppk, freelance web developer http://www.quirksmode.org/ -- __ css-discuss [EMAIL PROTECTED] 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] IE8 is better but ... X-UA-Compatible response header
Based on the Versioning and Internet Explorer Modes whitepaper, making the assumption that Microsoft just kept the old IE7 Quirks mode, it seems like we have four modes: IE7 Quirks (versions7), IE7 Standards (version=7), IE8 Standards (version =8) and Best possible (version=edge), with Best possible being the same as IE8 Standards in IE8. Copying the table from that whitepaper: Common Name New Compatibility Mode Value Quirks IE=5 IE7 Standards IE=7 IE8 Standards IE=8 Best possible mode IE=edge Yes, that's essentially correct. IE=edge was added back in the days the default behaviour was going to be IE7 mode, but now that the default has switched to Best (IE8 mode, for now), the edge value has become kind of pointless. -- --- ppk, freelance web developer http://www.quirksmode.org/ -- __ css-discuss [EMAIL PROTECTED] 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] a picture with in a picture
Scott Sauyet wrote: Jim Davis wrote: On Thu, Mar 6, 2008 at 6:57 PM, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Is it possible to have an image showing a picture frame and have that as part of the css style sheet. Here is a way to have the frame in as a background in the css and adding the image in the body of the html: http://www.jimdavis.org/test/frame_demo.html Or a similar technique with no additional markup: http://scott.sauyet.com/CSS/Demo/Frame/ Either method works only with fixed-size images. Techniques that use some sort of textured image to make a pseudo-frame are possible, but they will require additional containers in the markup, either included in the source or added by Javascript. -- Scott Interesting... I've played with background's color, padding and border's color/width to give images soft thin (usually 1-4px) shadows but I never thought of using images too (duh!). I guess I'm definitely not a graphic guy. Thanks for the insight :) Rafael. __ css-discuss [EMAIL PROTECTED] 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/
[css-d] Old friends - IE8 suffers from fuzzy specificity
... as all previous versions of IE have done http://www.fu2k.org/alex/css/hacks/fuzzyspecificity (Reported to the Microsoft beta forum) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check
Thank you Dave and Peter for the critiques. I have been fiddling with it and took out the height on the #main css, so the text won't shoot out the bottom now. Also, I darkened the text color a little and went with percent on the font rather than an absolute font size according to the suggestions of another lister. I'm a bit OCD when it comes to how things look, but I guess I need to learn to give up some of that control for the sake of the overall project. :) __ css-discuss [EMAIL PROTECTED] 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] X-UA-Compatible - discrepancies between targeted behaviour in IE8 and actual behaviour
Of course, I believe you, but I'm having difficulty tracking down where Microsoft say this. Any pointers? Not yet, but I'm 100% certain this is the case. Ah, ok. I see the answer in liorean's post. In the white paper / technology overview http://www.microsoft.com/downloads/details.aspx?FamilyId=4A3CB46C-8B8D-4B93-AC73-D0BA127B58FAdisplaylang=en Compatibility Mode Value Render Behavior IE=5 Quirks mode IE=7 Standards mode IE=8 Internet Explorer 8 Standards mode IE=edge Uses latest standards that Internet Explorer 8 and any future versions of the browser support. Not recommended for production sites. Yes. I remember now reading that elsewhere. I just can't believe they're not supporting IE6, but... 2. Parsing errors not replicated when targeting IE5. Which parsing errors exactly? The IE team is looking for such bug reports right now, so a few test cases would help a lot. In the example div#parsing { ... background: #ffcc00; backg\round: #006633; ... } Real IE5 colours the div yellow, emulated IE5 gets carried away and repaints it green. Duly noted. Don't know when I'll be able to send this on, though. It's alright. I'll report it. Oh no, I can't I'm not on the Technical Beta list. Well, I've posted to the IE8beta discussion forum. Also, #parsing should also be the same width as #control. So it looks as if IE8 is actually using IE6's parsing engine in conjunction with the IE5 box model. In fact, I've just done some tests and I'd say that looks as if is an understatement. To another thread... __ css-discuss [EMAIL PROTECTED] 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] IE 6 ignores margin on statically positioned div; also, background drop-out.
On Fri, 7 Mar 2008 16:09:40 -0800, Weston C wrote: This one's new to me: I don't recall IE6 messing up margins on a statically positioned container before, but this appears to be what I've got: http://weston.canncentral.org/web_lab/Arteis/MoboUbiq/ The box with the yellow border is the one I'm having trouble with. It's styled like so: [code snipped] Moz and Safari seem to display it perfectly. IE6 appears to completely ignore the margin instructions. Just for fun, I've tried triggering hasLayout and assigning position: relative, but it doesn't seem to change anything. IE7 ignores the top and side margins too. Adding a hasLayout trigger on the containing #thorax fixed it my end (using zoom: 1;) [...] Also, the orange bordered box farther down the page have another issue in IE6: the background-image applied to it doesn't start displaying until the content inside the div kicks in. The background isn't positioned in any way, and the border clearly shows the boundary of the box starts way above any ideas what could be happening here, too? This is strange. It only happens when the page is (re-)loaded. On covering the window, the image moves to the top when uncovered again. Anyway, a hasLayout trigger on the #contentsection seems to fix it. Cordially, David -- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check
Phoebe Taylor wrote: I have been fiddling with...] I'm a bit OCD when it comes to how things look, but I guess I need to learn to give up some of that control for the sake of the overall project. :) re: http://www.cgraytaylor.net/ You're looking good, and standing tall. If you're up for it, how about we raise the bar a notch? Correct the couple of CSS minor (and you think you have OCD) errors, and validate the CSS [1]: http://jigsaw.w3.org/css-validator/validator?profile=css21warning=0uri=http%3A%2F%2Fwww.cgraytaylor.net%2F And correct the two markup validaton errors, and validate the markup (on all pages) [2]: http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.cgraytaylor.net%2F [1] http://jigsaw.w3.org/css-validator/ [2] http://validator.w3.org/ Best, ~dL PS Validation is the very first thing you'll nailed for with a site check subjecy line... -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] 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/