[WSG] Two colum layout help
Hi all, I have been battling with this simple layout for a while and would really appreciate some help with it. Please ignore the colors/design etc. they are for illustration only. http://mail.nice.net.nz/test.html It works as I would like it to in Firefox/Konqueror but not in IE. I would love the 'Some Header' in the right column to align vertically with the top of the 'Other Links' and be fluid. I have looked at quite a few two column layouts around the web but I can't quite seem to adapt them to this situation. Please feel free to comment on any of the markup or CSS. Thanks in advance. hads -- Learned men are the cisterns of knowledge, not the fountainheads. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Two colum layout help
Hadley Rich wrote: http://mail.nice.net.nz/test.html It works as I would like it to in Firefox/Konqueror but not in IE. I would love the 'Some Header' in the right column to align vertically with the top of the 'Other Links' and be fluid. Adding... #content_container {_height: 0;} ...or better... #content_container {zoom: 1;} ...will make IE/win play along. These 'hasLayout'[1] triggers will not be accepted by the W3C CSS validator, but IE/win needs them. Use 'conditional comments' if you want to hide them from the validator. Georg [1]http://www.satzansatz.de/cssd/onhavinglayout.html -- http://www.gunlaug.no ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
Lachlan, The attached pic is a screen shoot from IE 6. Firefox 1.5 was fine...CheersAlOn 3/7/06, Lachlan Hunt [EMAIL PROTECTED] wrote:Philippe Wittenbergh wrote: http://lachy.id.au/dev/2006/03/fieldset On OS X 10.4.5 Firefox 1.5, Camino - latest nightly trunk build, iCab 3.0, Safari 2.03 and WebKit nightly build, Opera 9 tp2,all look the same. and so does Konqueror/KDE 3.5 running on top of OS X .Great!But I still need a solution to fix it in IE6. IE 5.2 Mac has a small 1pxwhite border around the legend, barely visible given your light background-color. There is also some white-space under the legend (padding on fieldset, you won't get rid of it).That's acceptable, IE/Mac is obsolete now anyway, so as long as the pageis readable, I'm not concerned.-- Lachlan Hunthttp://lachy.id.au/**The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help** -- Cheers!Al Kendall Untitled-2.png Description: PNG image
Re: [WSG] Styling Fieldset and Legend Elements
Al Kendall wrote: The attached pic is a screen shoot from IE 6. Firefox 1.5 was fine Yes, I know. I think you misread my e-mail. I knew it was broken in IE6, I'm looking for a way to fix it. Any ideas? -- Lachlan Hunt http://lachy.id.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
There is another example and a way of do it...It´s in portuguese my native, but if you follow the cod it´s easy, and pretty-- http://www.artideias.com
Re: [WSG] Two colum layout help
On Tuesday 07 March 2006 22:34, Gunlaug Sørtun wrote: ...will make IE/win play along. These 'hasLayout'[1] triggers will not be accepted by the W3C CSS validator, but IE/win needs them. Use 'conditional comments' if you want to hide them from the validator. Georg [1]http://www.satzansatz.de/cssd/onhavinglayout.html Excellent! That's a good read and something I had never (knowingly) come across before. Thanks much. hads -- Your heart is pure, and your mind clear, and your soul devout. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
Lachlan Hunt wrote: The following test case demonstrates how I want it to look and my current solution that works in Firefox. Both examples in the page should look roughly identical http://lachy.id.au/dev/2006/03/fieldset Don't know, but the following addition makes it look pretty ok in my IE6... * html legend {margin: 0 -6px; display: block;} Georg -- http://www.gunlaug.no ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] targeting link class problem
hello, How would i target a:hover on the following links? I tried a few things but cant get down to the classes(one, two). div id=navcontainershort ul li a href=# class=onebla bla/a/li li a href=# class=twobla/a/li -best kevin ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
I would advise against * html hacks though - http://www.webstandards.org/buzz/archive/2005_12.html#a000598Daz On 07/03/06, Gunlaug Sørtun [EMAIL PROTECTED] wrote: Lachlan Hunt wrote: The following test case demonstrates how I want it to look and my current solution that works in Firefox.Both examples in the page should look roughly identical http://lachy.id.au/dev/2006/03/fieldsetDon't know, but the following addition makes it look pretty ok in my IE6...* html legend {margin: 0 -6px; display: block;} Georg--http://www.gunlaug.no**The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help**
RE: [WSG] targeting link class problem
Hey Kev, #navcontainershort a.one:hover {} #navcontainershort a.two:hover {} Should access them specifically Mike Mike Foskett Web Standards, Accessibility Testing Consultant Communications British Educational Communications and Technology Agency (Becta) Milburn Hill Road, Science Park, Coventry CV4 7JJ Email: [EMAIL PROTECTED] Tel: 02476 416994 Ext 3342 [Tuesday - Thursday] Fax: 02476 411410 http://www.becta.org.uk -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of kvnmcwebn Sent: 07 March 2006 11:10 To: wsg@webstandardsgroup.org Subject: [WSG] targeting link class problem hello, How would i target a:hover on the following links? I tried a few things but cant get down to the classes(one, two). div id=navcontainershort ul li a href=# class=onebla bla/a/li li a href=# class=twobla/a/li -best kevin ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] targeting link class problem
On 3/7/06, kvnmcwebn [EMAIL PROTECTED] wrote: How would i target a:hover on the following links? I tried a few things but cant get down to the classes(one, two). div id=navcontainershort ul li a href=# class=onebla bla/a/li li a href=# class=twobla/a/li #navcontainershort a.one:hover doesn't work? If not try putting the class on LI and targetting as #navcontainershort [optional li].one a:hover hth, josh ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] targeting link class problem
div id=navcontainershort ul li a href=# class=onebla bla/a/li li a href=# class=twobla/a/li Start by thinking of the path from the body to the element you are trying to select. In this case the path (we don't know the entire path but theoretically) would be something like this: body div#navcontainershort ul li a.one So the selector could be: body div#navcontainershort ul li a.one {} You don't need to use the full path, so these are just as valid: body ul li a.one {} div#navcontainershort ul li a.one {} #navcontainershort ul a.one {} ul li a.one {} a.one {} The main point is to use these various elements as needed to make the selector more specific (target certain instances but not others) or to add weight (give it higher specificity). The pseudo-class can simply be added to the end of an element or class associated with the element. In this case it could be: #navcontainershort ul a.one:link {} #navcontainershort ul a.one:visited {} #navcontainershort ul a.one:focus {} #navcontainershort ul a.one:hover {} #navcontainershort ul a.one:active {} HTH Russ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] targeting link class problem
thanks russ and crew, my mistake was that i was putting the class first... like this .one ul li a:hover{ background-color: #88CAEF; } -kevin ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Vertical positioning of text
Hello ~ Im trying to avoid tables (for once!) and make a header that has several columns in it. I think Im very close! However, I want to be able to vertically align the text contained in the #headtitle div on the bottom and the #headnav1 and #headnav2 divs in the middle. I have looked at several discussions from the list, but Ive not been successful (except with middle aligning, but in Firefox only not IE). http://fullattention.com/hypnotherapy.shtml http://fullattention.com/styles.css Thanks for any and all assistance. White Ash [EMAIL PROTECTED] www.White-Ash.com
Re: [WSG] Vertical positioning of text
This was a very popular problem, there some ways to try to substitute that lack...U could see some were http://www.mail-archive.com/wsg%40webstandardsgroup.org/msg26048.html -- http://www.artideias.com
Re: [WSG] Vertical positioning of text
hey, I just had a quick look, its 2am so i should really get to sleep, I tried changing the styles a bit, I been designing for year so I dont know if this is the right way. I made the banner position:relative, so it makes any absolute inside the div absolute from the relative diveven though its at top so I dont know if its even needed. I then turned off the height on the headtitle, that was probably the problem, and took out the positioning from the top. give it a crack anyway, I work on a mac and works for me, just changed it a lil bit: #banner { padding: 0; margin: 0; margin-bottom: 0; background-color: #000; height:115px; position:relative; } #headtitle { position:absolute; margin-left:115px; width:160px; left: 0; bottom:0px; vertical-align:bottom; } and as for vertical aligning altogether, I only ever found this code, and Its only set up for vertical aligning in the middle of a browser. so I guess you could edit it and make it for vertical aligning in smaller divs (height), took me time to find it. and you can take out the margin: auto; and make it 100%. and I played around with it a fair bit. I changed this code at the for the outer to have 100%, but you can make it pixels, and it will place it in the middle of the browser. you could also put floats inside it and alter the heights etc to fit in smaller containers. anyways im outa here, adz html,body,#outermost { height: 100%; width: 100%; margin: 0; padding: 0; } body { text-align: center; /* IE/Win bug fix */font-size: 1em; font-family: Verdana, Arial, Helvetica, sans-serif; } #wrapper { margin: 10px; } #outer { height: 280px; width: 100%; border-top: 1px solid #f93; background-color: #585d5f; } /* Works in IE5+/Win, Opera 6+, Netscape 6+, Firefox, Konqueror 3, Safari Does not work in NS4.x or IE/Mac */ .valignmid1 { position: relative; margin: 0 auto; } /* Opera 7.0x is buggy when you put display:table on body Opera 7.2+ and 6.x don't appear to have this problem. We hide this from IE5/Mac, because it doesn't support display:table-cell and it doesn't have the same bug that allows this to work in IE5-6/Win (hide from IE/Mac) \*/ .valignmid1 { display: table; vertical-align: middle; } /* Moz1.4 - Moz1.6 (NS7.1) bug, can't put position:relative on .valignmid2 \*/ .valignmid2 { width: 100%; display: table-cell; vertical-align: middle; } * html .valignmid2 { top: 50%; left: 0; position: relative; } * html .valignmid3 { top: -50%; position: relative; } /* This is to make the text easier to select in IE5-6/Win (hide from IE/Mac) \*/ * html .valignmid1, * html .valignmid2, * html .valignmid3 p, * html .valignmid3 h1 { height: 1%; } div id=outermost class=valignmid1 div id=wrapper class=valignmid2 div id=outer class=valignmid1 valignmid3 div class=valignmid2 asdasd /div /div /div /div ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Dropped IE6 float
Hi all, I have a strange float that is dropping... http://www.compassdesigns.net/resources/wsgtest.html The layout is straight out of Dan Cedarholm/s Bulletproof, a simple nested float. However, in IE6, something strange occurs ("surely not!" I hear you say). As you reduce the page width, the right column gets dropped below. It looks like its flickering, but if you scroll down when its not there you will see it at the bottom. I guess its occurring every other pixel. At first I thought "rounding error" so I reduced the width of sidebar-2, but it still happened. Any ideas? [Using IE6 on win XP) Barrie North www.compassdesigns.net www.joomlashack.com
RE: [WSG] Dropped IE6 float
Stranger and stranger, If I add a border to #wrap and move the margin to body, it is fixed. body {text-align:center;margin:0 10%;}#wrap {border:1px #fff solid;text-align:left;} Trouble is, this fix won't work for me as I can't have a border on that element for my application, even a white one Barrie North www.compassdesigns.net www.joomlashack.com From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Barrie NorthSent: Tuesday, March 07, 2006 2:28 PMTo: wsg@webstandardsgroup.orgSubject: [WSG] Dropped IE6 float Hi all, I have a strange float that is dropping... http://www.compassdesigns.net/resources/wsgtest.html The layout is straight out of Dan Cedarholm/s Bulletproof, a simple nested float. However, in IE6, something strange occurs ("surely not!" I hear you say). As you reduce the page width, the right column gets dropped below. It looks like its flickering, but if you scroll down when its not there you will see it at the bottom. I guess its occurring every other pixel. At first I thought "rounding error" so I reduced the width of sidebar-2, but it still happened. Any ideas? [Using IE6 on win XP) Barrie North www.compassdesigns.net www.joomlashack.com
Re: [WSG] Collapsing columns on liquid design
Andreas Boehmer [Addictive Media] said: I am working on a liquid design of a website. The design fits fine into 800x600 and starts expanding beyond that. The problem I am facing is that I want a 10 pixel border to appear on the left and right of the design if the browser window is larger than 800x600. If the window is 800x600 the border should disappear (because otherwise the design doesn't fit). Hi Andreas, Does it have to be an unchanging 10px border? I ask because there's a design layout called jello layout that achieves something similar to what I think you are trying to accomplish. But it gives a gradually increasing border as the viewport is widened, not a fixed border. You may like to take a look anyway: http://www.positioniseverything.net/articles/jello-expo.html Cordially, David -- David Hucklesby, on 3/7/2006 http://www.hucklesby.com/ -- ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Web projects for students?
Any suggestions on web projects for my students this year http://www.tomw.net.au/2005/wd/? In the past I have got them to redesign the TV guide for the Transact digital set top box http://www.tomw.net.au/2002/transact.html, check the usability of the Beijing 2008 Olympic Web site http://www.tomw.net.au/2003/bws.html and make University web pages compatible with a mobile phone http://www.tomw.net.au/2005/wd/mobile.html. This year I thought I might get them to make a web site for the screen in the dash board of an Indian electric car http://www.tomw.net.au/technology/transport/reva.shtml or a robot aircraft http://www.tomw.net.au/technology/it/podcasting.shtml#uavpodcasts. Tom Worthington FACS HLM [EMAIL PROTECTED] Ph: 0419 496150 Director, Tomw Communications Pty LtdABN: 17 088 714 309 PO Box 13, Belconnen ACT 2617http://www.tomw.net.au/ Director, ACS Communications Tech Board http://www.acs.org.au/ctb/ Visiting Fellow, ANU Blog: http://www.tomw.net.au/blog/atom.xml ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Dropped IE6 float
Barrie North wrote: Stranger and stranger, I have a strange float that is dropping... http://www.compassdesigns.net/resources/wsgtest.html Try adding... #sidebar-2 { margin-left: -3px; } ...which will provide IE/win with some playroom for its rounding-bugs without really changing anything. It's known as 'pulling in the backside margin on floats' and makes that float appear slightly narrower in all browsers. It does fix the bug in my IE6. The actual negative-margin value is not scientifically tested :-) It just has to be large enough, but not so large that it creates a vertical hole that other elements can flow into from below. Georg -- http://www.gunlaug.no ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Web projects for students?
Tom Worthington wrote: Any suggestions on web projects for my students this year http://www.tomw.net.au/2005/wd/? G'day Tom, Could I suggest that quality projects present themselves quite easily in the form of non profit organisations. There are many of these around as we all know and many of them don't have the resources and funds to afford some quality web design. Working with live organisations provide the opportunity for students to interact with real people and respond to their needs and wishes and this is how the real world works. Another very beneficial aspect of working with non profits is that they are generally made up of members of the community. As such, students have the ability to spread the word about standards compliance and accessibility on a broad basis that can reach back into the business community itself. Kind regards, Ric PS On reviewing your page, albeit briefly, I noted your comparison of the web splash page with the cover of the book. A fair comparison I suppose, but personally I find splash pages a total waste of time and bytes. Give me the meat straight away. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
On 07/03/06, Darren West [EMAIL PROTECTED] wrote: I would advise against * html hacks though - http://www.webstandards.org/buzz/archive/2005_12.html#a000598 Daz On 07/03/06, Gunlaug Sørtun [EMAIL PROTECTED] wrote: Don't know, but the following addition makes it look pretty ok in my IE6...* html legend {margin: 0 -6px; display: block;} Put it in a conditional comment instead. Then you can even target IE6 specifically, and everyone's happy. :) Seona.
Re: [WSG] Styling Fieldset and Legend Elements
Seona Bellamy wrote: On 07/03/06, Darren West [EMAIL PROTECTED] wrote: I would advise against * html hacks though - http://www.webstandards.org/buzz/archive/2005_12.html#a000598 I tend to disagree with such nonsense. * html is a completely safe filter to use now that we know IE7 will not be supporting it in standards mode. Therefore, for any IE6-and-earlier only hack, it is perfectly safe to use it. IE 7 will then receive the same styles as all other browsers. If it turns out that the limitation is still present in IE7, the filter will need to be modified to target IE7 as well, but until we know for certain whether it is or not, we cannot safely target IE7. Put it in a conditional comment instead. Then you can even target IE6 specifically, and everyone's happy. :) I have already used a conditional comment in this particular site because few hacks I had used were still required in IE7b2, but that was before I realised that IE7b2 was nothing more than a joke and I probably shouldn't have bothered with it. -- Lachlan Hunt http://lachy.id.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
At 02:29 PM 3/7/2006, Lachlan Hunt wrote: Seona Bellamy wrote: On 07/03/06, Darren West [EMAIL PROTECTED] wrote: I would advise against * html hacks though - http://www.webstandards.org/buzz/archive/2005_12.html#a000598 I tend to disagree with such nonsense. With all due respect, Lachlan, your dismissive tone is inappropriate for a group of peers working together toward a common goal. Seona said nothing to warrant your unfriendliness, even if you disagree with her point intellectually. As for your intellectual point, surely you know that the reason that * html is a hack is that it assumes that the presence of one weakness of a browser indicates the presence of another totally unrelated weakness. These coincidental clusters of bugs vary from one version of a browser to the next which is why so many hacks are version-dependent. Like browser-sniffing, relying on them makes for fragile code. You can get away with using them for the time being, but where's the long view? When one weakness in a browser is eventually fixed but not another, the hack will break. Each time a browser vendor comes out with a new version, those of us who've used these hacks will either have to scurry around patching our hacky code or leave our old pages broken and bleeding in the ditches of the internet. Your own language indicates how convoluted this is: * html is a completely safe filter to use now that we know IE7 will not be supporting it in standards mode. Therefore, for any IE6-and-earlier only hack, it is perfectly safe to use it. IE 7 will then receive the same styles as all other browsers. If it turns out that the limitation is still present in IE7, the filter will need to be modified to target IE7 as well, but until we know for certain whether it is or not, we cannot safely target IE7. Yah, yah, yah. Why should our code depend on combinations of bugs occurring in the same version when we can simply filter for version numbers and leave it at that? Using conditional comments to work around IE's bugs is coding for the future. (Now all I need to do is follow my own advice...) Regards, Paul ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
star hack and IE 7 (was Re: [WSG] Styling Fieldset and Legend Elements)
Darren West wrote: I would advise against * html hacks though - http://www.webstandards.org/buzz/archive/2005_12.html#a000598 The * html hack will not pose a problem as long as IE 7 fixes its other bugs and inconsistencies (it will just ignore the * html like other good browsers, and - provided all the bugs that cause developers to use * html in the first place are addressed - will behave like any other modern browser). IMHO anyway. -- Patrick H. Lauke __ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com __ Web Standards Project (WaSP) Accessibility Task Force http://webstandards.org/ __ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
star hack and IE 7 (was Re: [WSG] Styling Fieldset and Legend Elements)
Paul Novitski wrote: These coincidental clusters of bugs vary from one version of a browser to the next which is why so many hacks are version-dependent. Like browser-sniffing, relying on them makes for fragile code. You can get away with using them for the time being, but where's the long view? No '* html' related problems in IE7 and later versions, since they won't recognize it. Quoting from... http://www.webstandards.org/buzz/archive/2005_12.html#a000598 -- Wilson points out that the goal is to fix IE, and getting there is a process. “I want to remove the * html hack to make it useful . . . because it will then only apply to obsolete browsers.” -- Looks like the '* html' hack will only get through to obsolete IE versions - IE6 and older, which to me makes it an extremely safe hack to use now and in the future. The fact that '* html' is valid nonsense makes it even better - IMO. ... Why should our code depend on combinations of bugs occurring in the same version when we can simply filter for version numbers and leave it at that? Using conditional comments to work around IE's bugs is coding for the future. Nothing wrong with 'conditional comments' - apart from the fact that we can't get what's inside them through to the validator(s) (unless we deliver it separately). I tend to think of 'conditional comments' as 'MSIE garbage-cans', and as such they may be very useful at times. The humble '* html' hack may even be used inside a *single* 'conditional commented stylesheet', which makes it even more useful since we can keep the different IE/win versions separate as part of a 'disgraceful degradation' strategy - and keep it all well away from the CSS validator while we're at it. Should work pretty well as long as IE accept 'conditional comments', and I think that comment-hack will last for a very long time. ...but then again - who knows anything substantial about the future... regards Georg -- http://www.gunlaug.no ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
I would advise against * html hacks though - http://www.webstandards.org/buzz/archive/2005_12.html#a000598 Personally I think building/testing/making long-term strategy for a beta-version browser is not advisable. We will not know what IE7 can and can't do until it is actually released. Until then we are all just wasting our time speculating and arguing. The next beta could break things that work in the current beta. I certainly don't understand why so many people have been so willing to accept Microsoft's decree - stop using that simple hack which can be removed from your CSS anytime you like; bloat your content with our proprietary hack, you miserable ingrates!. Conditional comments are a hack - an ugly, inefficient hack at that. Planning for the future includes the thought hey, when IE6 becomes irrelevant, I'm going to have to edit every single HTML document I've got to remove this bloat!. Remember, not every site uses a CMS (and not every CMS has a decent template system). Or alternatively, some browser will come out which has a bug that makes it read the stylesheet that was only intended for IE6; only to render a complete mess as it tries to cope with conflicting CSS. We do know that the * html hack works right now and it's entirely plausible that it will work just fine when IE7 comes out. It's entirely plausible that some future browser will have a problem with * html but it's also likely that IE6 will be a footnote by then so the hacks can be removed. The sky is not falling! /soapbox ;) Ben -- --- http://www.200ok.com.au/ --- The future has arrived; it's just not --- evenly distributed. - William Gibson ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
Paul Novitski wrote: Using conditional comments to work around IE's bugs is coding for the future. Personally, I have an aversion for adding cruft that only works in a specific browser family to my HTML, which should be browser agnostic. Sure, it validates, but it's just proprietary browser code disguised as a comment. As always, the above is the purist in me speaking. The pragmatist on the other hand will use it when necessary... -- Patrick H. Lauke __ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com __ Web Standards Project (WaSP) Accessibility Task Force http://webstandards.org/ __ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
At 05:02 PM 3/7/2006, Ben Buchanan wrote: Conditional comments are a hack - an ugly, inefficient hack at that. Planning for the future includes the thought hey, when IE6 becomes irrelevant, I'm going to have to edit every single HTML document I've got to remove this bloat!. My point was simply that IE's conditional comments -- and ugly they are, no argument there -- are more likely to work as intended in a few years than hacks like * html. Or alternatively, some browser will come out which has a bug that makes it read the stylesheet that was only intended for IE6; only to render a complete mess as it tries to cope with conflicting CSS. Exactly. I believe this is much more likely to occur with * html type hacks than conditional comments. We do know that the * html hack works right now and it's entirely plausible that it will work just fine when IE7 comes out. It's entirely plausible that some future browser will have a problem with * html but it's also likely that IE6 will be a footnote by then so the hacks can be removed. I don't think hacks will be removed from most pages. The amount of legacy crap on the web is phenomenal. Who bothers to clean up a three-year-old archive? That's the thinking that points me toward using hacks that will persist. Just to give myself a little perspective, I should confess that I do use the * html hack in my own stylesheets -- in fact it's pretty much the only one I do use. My previous outburst was motivated more by a desire to throw a bucket of water on someone's haughtiness than it was to start another holy war. Regards, Paul ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
Paul Novitski wrote: My point was simply that IE's conditional comments -- and ugly they are, no argument there -- are more likely to work as intended in a few years than hacks like * html. * html hacks will continue to work in IE6 forever, just as they do today. We already know this filter has been fixed in IE7 (standards mode), and so the following are exactly equivalent: !--[if lte IE 6] ... ![end if]-- * html foo { ... } (In the case of IE7 quirks mode, * html will still apply whereas the conditional comment would not. In fact, since IE7 quirks mode will be very close to IE6 quirks mode, * html would be better because it would be very likely that the patch will still be required.) So, any argument that stating that conditional comments are more future proof is a myth. In fact, if you're not careful with conditional comments, they can be more dangerous. Consider the following: * html #content { height: 1%; } !--[if IE]style#content { height: 1%; }/style![end if]-- The * html hack will only apply to IE 6 and earlier. That particular conditional comment will apply to all versions of IE since IE5 (when conditional comments were first added). If IE7 fixes the limitation from IE6, I'm sure you would agree that the patch should not apply to IE7 and, therefore, the use of a filter which does not apply to IE7 is the better option. The most effective future proofing method we have is to ensure that any hacks we do use today do not inadvertently target any future browser. It is better for future browsers to receive fully standards compliant CSS, then for them to apply patches intended for and only tested in current browsers. If the fate of * html was not yet known then I would agree that conditional comments with a version number specified are safer, but since we do know that * html is equivalent to [if lte IE 6], both are completely safe. -- Lachlan Hunt http://lachy.id.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] IE Reverse Indent ?
Hi,I have a question about something IE6 is doing that Firefox1.5 is not. (I know... no surprise !)I have checked, but must have overlooked the solution to this one...On this page... http://www.hudsonantiquecarclub.com/index.htmlIE6 adds an reverse indent just under the header Monthly Meetings (Paragraph starting Rudy's...)Is this to do with the thumbnail to the left? Thanks for the help. I really enjoy reading the posts here... very informative !Regards,Kevin.
Re: [WSG] Styling Fieldset and Legend Elements
Lachlan Hunt wrote: * html hacks will continue to work in IE6 forever, just as they do today. We already know this filter has been fixed in IE7 (standards mode), and so the following are exactly equivalent: !--[if lte IE 6] ... ![end if]-- * html foo { ... } I think it worth mentioning that the * html hack works in IE *Mac* too. Regards, Thierry | www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] IE Reverse Indent ?
Kevin wrote On this page... http://www.hudsonantiquecarclub.com/index.html IE6 adds an reverse indent just under the header Monthly Meetings Hi Kevin Adding a couple extra pixels to the #content_home right margin should fix things up. Regards Scott Swabey Design Development Director Lafinboy Productions www.lafinboy.com www.thought-after.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
Thierry Koblentz wrote: I think it worth mentioning that the * html hack works in IE *Mac* too. What about conditional comments? I don't think that really matters much anyway, since IE Mac is officially obsolete (i.e. now completely unsupported by Microsoft) and I think some unwanted hacks applying to it would be the least of its problems. -- Lachlan Hunt http://lachy.id.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] IE Reverse Indent ?
Kevin Ross wrote: http://www.hudsonantiquecarclub.com/index.html IE6 adds an reverse indent just under the header Monthly Meetings (Paragraph starting Rudy's...) Is this to do with the thumbnail to the left? Known as the 3 pixel text-jog http://www.positioniseverything.net/explorer/threepxtest.html Easily fixed by adding #content_home to the IE specific style you have already: ul a, ul, li, #content_home {height: 1%;} /* Holly hack fix for IE bugs */ Regards Jason ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] IE Reverse Indent ?
On Mar 8, 2006, at 2:51 PM, Jason Turnbull wrote: http://www.hudsonantiquecarclub.com/index.html IE6 adds an reverse indent just under the header Monthly Meetings (Paragraph starting Rudy's...) Is this to do with the thumbnail to the left? Known as the 3 pixel text-jog http://www.positioniseverything.net/explorer/threepxtest.html Easily fixed by adding #content_home to the IE specific style you have already: ul a, ul, li, #content_home {height: 1%;} /* Holly hack fix for IE bugs */ That is a bit radical... giving all those element 'layout' can possibly cause more problems than it fixes. In this case: /* - hide form IE Mac - \*/ * html #content_contain {height:1%} /* - end hiding - */ ought to do nicely. (and served only to IE 6 and below. That 3px jog thing is reportedly fixed in IE 7 alpha0). Philippe --- Philippe Wittenbergh http://emps.l-c-n.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Styling Fieldset and Legend Elements
On Mar 8, 2006, at 2:48 PM, Lachlan Hunt wrote: Thierry Koblentz wrote: I think it worth mentioning that the * html hack works in IE *Mac* too. What about conditional comments? I don't think that really matters much anyway, since IE Mac is officially obsolete (i.e. now completely unsupported by Microsoft) and ... It might be unsupported by MS, but it is still quite well used, in the **real** world. That said, no, IE Mac doesn't support CC. I think some unwanted hacks applying to it would be the least of its problems. Let it see some of the hacks targeted at IE Win can end in a complete disaster (i.e. inaccessible content). The often used 'Holly Hack' (height:1%) causes big problems in IE Mac. That browser incorrectly computes % height as '0' instead of 'auto' as it should per CSS 2.1 (for in-flow elements when no parent element has a height specified). Philippe --- Philippe Wittenbergh http://emps.l-c-n.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] IE Reverse Indent ?
Philippe Wittenbergh wrote: ul a, ul, li, #content_home {height: 1%;} /* Holly hack fix for IE bugs */ That is a bit radical... giving all those element 'layout' can possibly cause more problems than it fixes. In this case: /* - hide form IE Mac - \*/ * html #content_contain {height:1%} /* - end hiding - */ ought to do nicely. (and served only to IE 6 and below. That 3px jog thing is reportedly fixed in IE 7 alpha0). Your right Philippe it is radical, I added to styles within IE conditional comments that already existed. Philippe has a point about IE7, currently your conditional comments target all versions of IE and should only need IE6 and below: !--[if lte IE 6] Regards JAson ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **