RE: [WSG] WHYYY??? WHYYYY???
Hmmm, a) it doesn't validate... Should really be fixed before posting unless validation is the question. b) Box model hack? There are ways around this. I strongly suggest you lose this and structure the page so that is doesn't require it. c) Why the ? I think would work much better and save some noodles in the soup. This may well have something to do with it. Extra div there pushing things around. I know Russ showed you this at some stage but I believe it was for a particular reason. You could also just add the rule to the required divs. I changed the width of #content down to 558px and then it works so you have an issue in the space held for that div. P > -Original Message- > From: Universal Head [mailto:[EMAIL PROTECTED] > Sent: Tuesday, February 17, 2004 5:29 PM > To: [EMAIL PROTECTED] > Subject: [WSG] WHYYY??? WH??? > > > I beg of you, can someone explain why this works in every browser > except WIN IE6? In that &^%%^&$^ browser, the red content > area does not > sit where it should, beside the sidenav. > > http://www.universalhead.com/clients/test > > This should be so simple! It's driving me nuts! > > Thanks > Peter > > * > The discussion list for http://webstandardsgroup.org/ > * > * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] WHYYY??? WHYYYY???
There's no margin or padding. These days this is the first thing I check. Thanks to the inestimable, exalted, talented, selfless, charitable Hugh Todd it's starting to work. If in doubt, make both of the b*astards float left. How do you all handle this folks? My brain is going to pop. As I said to Hugh, I always hated Rubik's Cubes, and this CSS stuff is like one big twenty-sided one. With colours that randomly change. P On 17/02/2004, at 5:33 PM, Mark Stanton wrote: margin+border+padding+width (in IE6) > margin+border+padding+width (in everything else) Universal Head Design That Works. 7/43 Bridge Rd Stanmore NSW 2048 Australia T (+612) 9517 1466 F (+612) 9565 4747 E [EMAIL PROTECTED] W www.universalhead.com
Re: [WSG] Can a list have one item?
Wow man, that's deep. I would say yes. You are simply stating what follows is a collection of elements. It might be zero, one or many elements. The purpose of wrapping around your item(s) is to put those item(s) into context. To answer your second question, I'd say it's not a list when you choose it not to be! But maybe I'm wrong. Cheers, Ben James Ellis wrote: This is a bit existential, but can a list have one item? When is a list not a list anymore? * The discussion list for http://webstandardsgroup.org/ *
RE: [WSG] WHYYY??? WHYYYY???
Hey Peter What happens when you reduce the width by a few pixels? Does it move up? If so I'd say that you've got some IE box model weirdness going on. margin+border+padding+width (in IE6) > margin+border+padding+width (in everything else) If that does fix it I'm at a loss. Cheers Mark -- Mark Stanton Technical Director Gruden Pty Ltd Tel: 9956 6388 Mob: 0410 458 201 Fax: 9956 8433 http://www.gruden.com * The discussion list for http://webstandardsgroup.org/ *
RE: [WSG] Can a list have one item?
I think a list with one item is ok, for example: Mark - Shopping List Ciggies That's still as list in my book. However I think you should check the count server side anyway to avoid the following: Mark - New Years Resolutions The DTD backs me up on this one A+ = A must occur one or more times. Cheers Mark -- Mark Stanton Technical Director Gruden Pty Ltd Tel: 9956 6388 Mob: 0410 458 201 Fax: 9956 8433 http://www.gruden.com * The discussion list for http://webstandardsgroup.org/ *
[WSG] WHYYY??? WHYYYY???
I beg of you, can someone explain why this works in every browser except WIN IE6? In that &^%%^&$^ browser, the red content area does not sit where it should, beside the sidenav. http://www.universalhead.com/clients/test This should be so simple! It's driving me nuts! Thanks Peter * The discussion list for http://webstandardsgroup.org/ *
[WSG] Can a list have one item?
This is a bit existential, but can a list have one item? Oliver Twist If I'm generating the list using server side script, and I don't know how many items will be returned, I suppose it's ok to have one item? When is a list not a list anymore? Cheers James * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Unordered list with id
Thanks, you're a genius! Gav - Original Message - From: "Ben Bishop" <[EMAIL PROTECTED]> To: <[EMAIL PROTECTED]> Sent: Tuesday, February 17, 2004 4:38 PM Subject: Re: [WSG] Unordered list with id > > Hi Gavin, > > Quick fix. You can make either (or both) of the following changes: > > #mcqnav .thisquestionlink { > background: red; > } > > OR > > #mcqnav .thisquestionlink { > background: red !important; > } > > Regards, > Ben > > Gavin Cooney wrote: > > >Now i want to highlight the current page using a different CSS style. I have > >tried all sorts of combinations, and in this example i have an > >ID="thisquestion" on the relevant and a class="thisquestionlink" on the > > inside the . > > > > > > * > The discussion list for http://webstandardsgroup.org/ > * > > * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Unordered list with id
Try this link: http://www.alistapart.com/articles/keepingcurrent/ regards Anthony >Hi All, > >I'm just getting my head around CSS and this is really bugging me. > >I have an unordered list styled as navigation to a HTML page. This works >fine. > >Now i want to highlight the current page using a different CSS style. I have >tried all sorts of combinations, and in this example i have an >ID="thisquestion" on the relevant and a class="thisquestionlink" on the > inside the . > >It just wont seem to style for me. I want to have a different Background >color etc on it. > >Can someone please help me with this simple question? > >http://www4.boardofstudies.nsw.edu.au/wsg_test/ > >Thanks a lot > >Gavin > >* >The discussion list for http://webstandardsgroup.org/ >* * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Unordered list with id
Gavin, You want to be able to identify the current page with a distinctive background for the appropriate list item? Here's a site on which it works well. Take a look at the code at the bottom of the site's style sheet. In the body id code for each HTML page he names the current page/area of the site, which triggers a background inside the appropriate tag (by calling on the appropriate a#mnu style for that page). http://www.wasabicube.com/ http://www.wasabicube.com/s/wc.css Hope this helps. -Hugh Todd Now i want to highlight the current page using a different CSS style. I have tried all sorts of combinations, and in this example i have an ID="thisquestion" on the relevant and a class="thisquestionlink" on the inside the . It just wont seem to style for me. I want to have a different Background color etc on it. Can someone please help me with this simple question? http://www4.boardofstudies.nsw.edu.au/wsg_test/ * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Unordered list with id
Oops. I actually meant: Quick fix. You can make either (or both) of the following changes: #mcqnav .thisquestionlink { background: red; } OR .thisquestionlink { background: red !important; } * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Unordered list with id
Hi Gavin, Quick fix. You can make either (or both) of the following changes: #mcqnav .thisquestionlink { background: red; } OR #mcqnav .thisquestionlink { background: red !important; } Regards, Ben Gavin Cooney wrote: Now i want to highlight the current page using a different CSS style. I have tried all sorts of combinations, and in this example i have an ID="thisquestion" on the relevant and a class="thisquestionlink" on the inside the . * The discussion list for http://webstandardsgroup.org/ *
[WSG] Unordered list with id
Hi All, I'm just getting my head around CSS and this is really bugging me. I have an unordered list styled as navigation to a HTML page. This works fine. Now i want to highlight the current page using a different CSS style. I have tried all sorts of combinations, and in this example i have an ID="thisquestion" on the relevant and a class="thisquestionlink" on the inside the . It just wont seem to style for me. I want to have a different Background color etc on it. Can someone please help me with this simple question? http://www4.boardofstudies.nsw.edu.au/wsg_test/ Thanks a lot Gavin * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] IE 6 not behaving (again)
Sorry but I'm not seeing any obvious errror http://positionrelative.com/snippets/books247.jpg please tell us more, or show us a screenshot s Paul Ross wrote: Hello WSG-ers, This is probably a damn silly question but I can't figure out why IE is doing this to me. This works in Mozilla and Safari. It validates as XHTML transitional and the CSS validates too. But in IE the page breaks. The trouble is the horizontal image navbar I have built. In IE6 the far right image has wrapped underneath the other images as if it doesn't fit inside its container. I have checked the pixel dimensions and it should be fine. Can someone with IE please put me out of my misery. The test page is here... http://www.skyrocket.com.au/Concepts/Books24x7/index.html Regards PAUL ROSS SkyRocket Design Co http://www.skyrocket.com.au - This mail sent through IMP: http://horde.org/imp/ * The discussion list for http://webstandardsgroup.org/ * * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Javascript question
Good question There is actually already a lot being done on the server side and this solution is partly trying to split the load, but mostly the 200 or so other outstanding bugs that our 2 java guys are working through means that I have to try this solution for primary release. To be honest we were actually planning on doing this whole thing in a visual interface probably using flash, but that hasn't happened yet. Beau wrote: Hey Scott, No offense, and not particularly helpful in this case, but *why on earth* would you want to do something like that in JavaScript??? Any sort of thing like that, with large loops, and modified output based on data that (I hope) is stored in a database is *definitely* better handled server-side using something like PHP, or if you're into that sort of thing; Cold Fusion or ASP. Is there a particular reason why you want it done in JS? (Mind you - I am very impressed at your code and having it work!) Cheers, Beau * The discussion list for http://webstandardsgroup.org/ *
RE: [WSG] Cache Tutorial
I really don't think this is OT at all. HTTP is the basis of everything we do and is very much a "web standard". I think that if you put the following line of code in your stream.php file: header("HTTP/1.0 304 Not Modified"); it should solve your problem. Use the LiveHTTPHeaders plugin for Firefox to test the results out. Cheers Mark -- Mark Stanton Technical Director Gruden Pty Ltd Tel: 9956 6388 Mob: 0410 458 201 Fax: 9956 8433 http://www.gruden.com * The discussion list for http://webstandardsgroup.org/ *
[WSG] IE 6 not behaving (again)
Hello WSG-ers, This is probably a damn silly question but I can't figure out why IE is doing this to me. This works in Mozilla and Safari. It validates as XHTML transitional and the CSS validates too. But in IE the page breaks. The trouble is the horizontal image navbar I have built. In IE6 the far right image has wrapped underneath the other images as if it doesn't fit inside its container. I have checked the pixel dimensions and it should be fine. Can someone with IE please put me out of my misery. The test page is here... http://www.skyrocket.com.au/Concepts/Books24x7/index.html Regards PAUL ROSS SkyRocket Design Co http://www.skyrocket.com.au - This mail sent through IMP: http://horde.org/imp/ * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Javascript question
If anyone could think of a better way to do this, or even an efficiency tweak I would be very grateful. How about using iteration instead of recursion? -- tim * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Javascript question
Hey Scott, No offense, and not particularly helpful in this case, but *why on earth* would you want to do something like that in JavaScript??? Any sort of thing like that, with large loops, and modified output based on data that (I hope) is stored in a database is *definitely* better handled server-side using something like PHP, or if you're into that sort of thing; Cold Fusion or ASP. Is there a particular reason why you want it done in JS? (Mind you - I am very impressed at your code and having it work!) Cheers, Beau -- Beau Lebens Information Architect [EMAIL PROTECTED] Dented Reality - www.dentedreality.com.au Information Architecture, Usability, Web Development scott parsons said: > > OK, so a different standard from the one we usually talk about > I have this page > http://positionrelative.com/snippets/jstest.htm > > Now if you visit the site you should see a huge list of suburbs, to > which I am adding some letter headers for each letter. Sounds simple > enough except that it takes far too long for the JS to work, and I'm > stuck as to how to improve it. > My js function is > > function recurseNodes(aNodes) { > for (var i=0; i if (aNodes[i].nodeType == 1) { > if (aNodes[i].tagName.toLowerCase() == "label") { > //label found > //get first character > var c = aNodes[i].innerHTML.charAt(0); > if (c != currentLetter) { > //insert node for for new letter heading > var newNode = document.createElement("h2"); > newNode.innerHTML = c.toUpperCase(); > > aNodes[i].parentNode.parentNode.insertBefore(newNode, aNodes[i].parentNode); > > //for safari > //var newNode2 = document.createElement("a"); > //newNode2.setAttribute("name", sPrefix + > c.toLowerCase()); > > //aNodes[i].parentNode.parentNode.insertBefore(newNode, > aNodes[i].parentNode); > > //set current letter > currentLetter = c; > } > } > //recurse > if (aNodes[i].hasChildNodes) { > recurseNodes(aNodes[i].childNodes); > } > } > } > } > > > The safari bit was for another additional function which has now been > curtailed (I have very much the moving goalposts on this one!) > If anyone could think of a better way to do this, or even an efficiency > tweak I would be very grateful. > > p.s. this page is just a snippet so may be a little messy...apologies > > > thanks > > scottbp > * > The discussion list for http://webstandardsgroup.org/ > * > > * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Cache Tutorial
Thanks Mark [OT] though relevant to web caching. Has anyone been able to convince a browser to cache images that are served like this Adding various header directives in the response should work, but the browser always insists on reloading the image. During standard image requests the web server responds with a "304 Not Modified" response when the image is cached, so that the browser doesn't bother to reload the image. I cannot seem to emulate this behaviour via a fpassthru() PHP call. Regards Chris Blown On Tue, 2004-02-17 at 10:04, Mark Stanton wrote: > Very nice & thorough article on how web caching works and how it can be used > wisely. > > http://www.mnot.net/cache_docs/ > > > > Cheers > > Mark > > > -- > Mark Stanton > Technical Director > Gruden Pty Ltd > Tel: 9956 6388 > Mob: 0410 458 201 > Fax: 9956 8433 > http://www.gruden.com > > * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] bit of help needed !
Yep, if I change this to pixels, the problem disappears. Yet more meaningless time-wasting badly implemented fun from our web browser coding friends. Peter On 17/02/2004, at 11:20 AM, Michael Donnermeyer wrote: I don't have the time to try this, but see what happens if you take the "line-height: 1.8em" out. Universal Head Design That Works. 7/43 Bridge Rd Stanmore NSW 2048 Australia T (+612) 9517 1466 F (+612) 9565 4747 E [EMAIL PROTECTED] W www.universalhead.com
[WSG] Javascript question
OK, so a different standard from the one we usually talk about I have this page http://positionrelative.com/snippets/jstest.htm Now if you visit the site you should see a huge list of suburbs, to which I am adding some letter headers for each letter. Sounds simple enough except that it takes far too long for the JS to work, and I'm stuck as to how to improve it. My js function is function recurseNodes(aNodes) { for (var i=0; i if (aNodes[i].nodeType == 1) { if (aNodes[i].tagName.toLowerCase() == "label") { //label found //get first character var c = aNodes[i].innerHTML.charAt(0); if (c != currentLetter) { //insert node for for new letter heading var newNode = document.createElement("h2"); newNode.innerHTML = c.toUpperCase(); aNodes[i].parentNode.parentNode.insertBefore(newNode, aNodes[i].parentNode); //for safari //var newNode2 = document.createElement("a"); //newNode2.setAttribute("name", sPrefix + c.toLowerCase()); //aNodes[i].parentNode.parentNode.insertBefore(newNode, aNodes[i].parentNode); //set current letter currentLetter = c; } } //recurse if (aNodes[i].hasChildNodes) { recurseNodes(aNodes[i].childNodes); } } } } The safari bit was for another additional function which has now been curtailed (I have very much the moving goalposts on this one!) If anyone could think of a better way to do this, or even an efficiency tweak I would be very grateful. p.s. this page is just a snippet so may be a little messy...apologies thanks scottbp * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Why cant i see the bullets?
Well Crikey!!! what do you know that works... brilliant ...thanks so much...I'm happy now. ;o) Jackie Reid - Original Message - From: "Luc" <[EMAIL PROTECTED]> To: "Jackie Reid on wsg" <[EMAIL PROTECTED]> Sent: Tuesday, February 17, 2004 11:03 AM Subject: Re: [WSG] Why cant i see the bullets? > > Hello Jackie, > > It was foretold that on 17-2-2004 @ 10:39:10 GMT+1000 (which was > 1:39:10 where I live) Jackie Reid would mumble: > > > > JR> unfortunately didn't seem to fix it any other ideas? > > ul { > list-style-type: disc; > list-style-position:inside; > margin-top: 6px; > width: 60%;} > > That should do it (tested it localy, not online though) > > -- > Best regards, > Luc > _ > > http://www.dzinelabs.com > > Powered by The Bat! version 1.63 Beta/7 with Windows 2000 (build > 2195), version 5.0 Service Pack 4 and using the best browser: Opera. > > "Don't worry about the world ending today . . . It's already tomorrow > in Australia." > > * > The discussion list for http://webstandardsgroup.org/ > * > > * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Why cant i see the bullets?
Hello Jackie, It was foretold that on 17-2-2004 @ 10:39:10 GMT+1000 (which was 1:39:10 where I live) Jackie Reid would mumble: JR> unfortunately didn't seem to fix it any other ideas? ul { list-style-type: disc; list-style-position:inside; margin-top: 6px; width: 60%;} That should do it (tested it localy, not online though) -- Best regards, Luc _ http://www.dzinelabs.com Powered by The Bat! version 1.63 Beta/7 with Windows 2000 (build 2195), version 5.0 Service Pack 4 and using the best browser: Opera. "Don't worry about the world ending today . . . It's already tomorrow in Australia." * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] bit of help needed !
This is what I was trying to find out about before - why does Opera shift everything? It's a simple content container div with horizontal margins set to auto. I'll try the other suggestion, thanks. P On 17/02/2004, at 11:20 AM, Michael Donnermeyer wrote: Opera of course has the 4px or so gap at the top, and the whole content part is shifted 10 or 15 pixels left. But, on the bright side it's not collapsing the borders. Universal Head Design That Works. 7/43 Bridge Rd Stanmore NSW 2048 Australia T (+612) 9517 1466 F (+612) 9565 4747 E [EMAIL PROTECTED] W www.universalhead.com
Re: [WSG] Why cant i see the bullets?
Whooops... didn't notice that and have been looking at the code till blue in the face... unfortunately didn't seem to fix it any other ideas? ...please :) Jackie Reid - Original Message - From: Michael Donnermeyer To: [EMAIL PROTECTED] Sent: Tuesday, February 17, 2004 10:23 AM Subject: Re: [WSG] Why cant i see the bullets? li {color: #000;margin-top: 1px; background-color: #bebe9d;padding: 1px 1px 1px 10px}try putting the missing ; in there at the end of the padding...might be the issue.MDOn Feb 16, 2004, at 18:52, Jackie Reid wrote: Hello Group... I need a bit of help here...ould someone please explain why I can't see the bullets in my in IE... looks fine in firebird so whats the go! NOTE! - please ignore colours etc just working on the layout atm http://www.mockorange.com.au/test/one/index.php http://www.mockorange.com.au/test/one/css/first.css Thanks Jackie ReidMock Orange Web Site Development1st Floor92 Victoria StreetMACKAY Q 4740Ph: 07 4953 4035 [EMAIL PROTECTED]
Re: [WSG] Why cant i see the bullets?
li {color: #000; margin-top: 1px; background-color: #bebe9d; padding: 1px 1px 1px 10px} try putting the missing ; in there at the end of the padding...might be the issue. MD On Feb 16, 2004, at 18:52, Jackie Reid wrote: Hello Group... I need a bit of help here...ould someone please explain why I can't see the bullets in my in IE... looks fine in firebird so whats the go! NOTE! - please ignore colours etc just working on the layout atm http://www.mockorange.com.au/test/one/index.php http://www.mockorange.com.au/test/one/css/first.css Thanks Jackie Reid Mock Orange Web Site Development 1st Floor 92 Victoria Street MACKAY Q 4740 Ph: 07 4953 4035 [EMAIL PROTECTED]
Re: [WSG] bit of help needed !
As far as I can tell it's a bug in Moz/Netscape. I've had it happen a few times before, and got myself so worked up trying to figure it out that I wanted to start shooting things. On the plus side, IE5.2, Safari 1,2, and Opera 6.03 display the nav right. Opera of course has the 4px or so gap at the top, and the whole content part is shifted 10 or 15 pixels left. But, on the bright side it's not collapsing the borders. I don't have the time to try this, but see what happens if you take the "line-height: 1.8em" out. I vaguely remember that as a possible cause for problems, but it's been a while so my mind might just be playing tricks on me. MD On Feb 16, 2004, at 18:47, Universal Head wrote: Still stumped on this one though! ;) http://www.universalhead.com/clients/test http://www.universalhead.com/clients/test/css/main.css - in Mac Mozilla and PC NN7 the 1px bottom borders on the sidenav list sometimes close up. Universal Head Design That Works. 7/43 Bridge Rd Stanmore NSW 2048 Australia T (+612) 9517 1466 F (+612) 9565 4747 E [EMAIL PROTECTED] W www.universalhead.com
[WSG] Why cant i see the bullets?
Hello Group... I need a bit of help here...ould someone please explain why I can't see the bullets in my in IE... looks fine in firebird so whats the go! NOTE! - please ignore colours etc just working on the layout atm http://www.mockorange.com.au/test/one/index.php http://www.mockorange.com.au/test/one/css/first.css Thanks Jackie ReidMock Orange Web Site Development1st Floor92 Victoria StreetMACKAY Q 4740Ph: 07 4953 4035 [EMAIL PROTECTED]
Re: [WSG] bit of help needed !
Pete, This may help you: http://www.alistapart.com/articles/practicalcss/ There's a bit of useful forms code there. -Hugh Todd Could someone have a look at this: http://www.universalhead.com/clients/test http://www.universalhead.com/clients/test/css/main.css * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] bit of help needed !
Still stumped on this one though! ;) http://www.universalhead.com/clients/test http://www.universalhead.com/clients/test/css/main.css - in Mac Mozilla and PC NN7 the 1px bottom borders on the sidenav list sometimes close up. Universal Head Design That Works. 7/43 Bridge Rd Stanmore NSW 2048 Australia T (+612) 9517 1466 F (+612) 9565 4747 E [EMAIL PROTECTED] W www.universalhead.com
Re: [WSG] bit of help needed !
I think I've worked it out now, but perhaps someone could look at the code and let me know if I did it the right way ... Thanks Peter http://www.universalhead.com/clients/test http://www.universalhead.com/clients/test/css/main.css * The discussion list for http://webstandardsgroup.org/ *
[WSG] Cache Tutorial
Very nice & thorough article on how web caching works and how it can be used wisely. http://www.mnot.net/cache_docs/ Cheers Mark -- Mark Stanton Technical Director Gruden Pty Ltd Tel: 9956 6388 Mob: 0410 458 201 Fax: 9956 8433 http://www.gruden.com * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] bit of help needed !
In Both IE6 and FIREFOX.. it looks like the borders are hanging over a good 5 to 10 pixels... - its probably the padding pushing it over... im not too sure - just letting you know.. i bet its that box model problem Chris Stratford [EMAIL PROTECTED] Http://www.neester.com Universal Head wrote: Hi Could someone have a look at this: http://www.universalhead.com/clients/test http://www.universalhead.com/clients/test/css/main.css Two problems: - I can't get that formbox div (I've put a border around it to make its boundaries to clear) to sit vertically aligned and to the right of that bar, no matter what combination of floats and inlines and whatever else I use. Floating it right works in some browsers and pushes outside it's containing div in others. and - in Mac Mozilla and PC NN7 the 1px bottom borders on the sidenav list sometimes close up. I'd very much appreciate some insight into these two annoying problems, Cheers Peter Universal Head Design That Works. 7/43 Bridge Rd Stanmore NSW 2048 Australia T (+612) 9517 1466 F (+612) 9565 4747 E [EMAIL PROTECTED] W www.universalhead.com * The discussion list for http://webstandardsgroup.org/ *
RE: [WSG] Cool No-delay image rollover technique
So in that case there’s no difference between _javascript_ rollovers or these single image rollovers from the user’s standpoint - they either download the image every time they roll over it on both or they don’t, depending on whether they have caching turned off – but there’s a benefit in terms of the size of the code and accessibility to using the CSS method. Does that sum it up fairly? Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com From: Ryan Christie [mailto:[EMAIL PROTECTED] Sent: Tuesday, 17 February 2004 9:38 AM To: [EMAIL PROTECTED] Subject: Re: [WSG] Cool No-delay image rollover technique You'd still get the same effect Michael, but with CSS positioning of a solid image, your code is smaller, more users can see the rollovers, and it just works faster. There's nothing wrong with old-fashioned (keyword) JS rollovers, CSS is just more economical. Michael Kear wrote: Wouldn't you get the same effect with old-fashioned _javascript_ rollovers ifyou have caching turned off? I remember the first attempt I made at doing rollovers using the dreamweaverbehaviour, I couldn't figure out how come it worked beautifully on my localmachine but not on the web. Till I realised I had caching turned off andthe images were loading every time. CheersMike KearWindsor, NSW, AustraliaAFP Webworkshttp://afpwebworks.com -Original Message-From: Ben Bishop [mailto:[EMAIL PROTECTED]] Sent: Monday, 16 February 2004 10:45 PMTo: [EMAIL PROTECTED]Subject: Re: [WSG] Cool No-delay image rollover technique I experience the same issue as Peter in Firefox with caching turned off.(although I don't see a delay, I know it's loading a fresh copy of the image when the firewall winks at me every time I roll over tabs on the Fast Company web site.) Here's a real purdy looking tutorial from Dan Cedarholm, note the comments bring up this very issue.http://www.simplebits.com/archives/2003/09/30/accessible_imagetab_rollovers.html I agree with Peter, it's a clean way to handle roll-overs. And the majority of users might have caching turned on. Otherwise if you follow the link at the bottom of the Pixy tutorial, there's a simple band-aid. Regards,Ben Peter Firminger wrote: I know I have my browser (IE 6 WinXP Pro) set to not cache anything, but this method doesn't work for me. Over a second delay on rollover and roll off with a blank space in the meantime. It makes no difference to a _javascript_ preload at all. Much better code though so I'm not canning it. *From:* Michael Kear ** Using this technique you can get all the graphical/ 3d advantages of _javascript_ rollovers, but instead of _javascript_ it uses CSS to move an image around giving the rollover effect. The article's at http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/ * The discussion list for http://webstandardsgroup.org/ *
[WSG] bit of help needed !
Hi Could someone have a look at this: http://www.universalhead.com/clients/test http://www.universalhead.com/clients/test/css/main.css Two problems: - I can't get that formbox div (I've put a border around it to make its boundaries to clear) to sit vertically aligned and to the right of that bar, no matter what combination of floats and inlines and whatever else I use. Floating it right works in some browsers and pushes outside it's containing div in others. and - in Mac Mozilla and PC NN7 the 1px bottom borders on the sidenav list sometimes close up. I'd very much appreciate some insight into these two annoying problems, Cheers Peter Universal Head Design That Works. 7/43 Bridge Rd Stanmore NSW 2048 Australia T (+612) 9517 1466 F (+612) 9565 4747 E [EMAIL PROTECTED] W www.universalhead.com
Re: [WSG] Cool No-delay image rollover technique
You'd still get the same effect Michael, but with CSS positioning of a solid image, your code is smaller, more users can see the rollovers, and it just works faster. There's nothing wrong with old-fashioned (keyword) JS rollovers, CSS is just more economical. Michael Kear wrote: Wouldn't you get the same effect with old-fashioned _javascript_ rollovers if you have caching turned off? I remember the first attempt I made at doing rollovers using the dreamweaver behaviour, I couldn't figure out how come it worked beautifully on my local machine but not on the web. Till I realised I had caching turned off and the images were loading every time. Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com -Original Message- From: Ben Bishop [mailto:[EMAIL PROTECTED]] Sent: Monday, 16 February 2004 10:45 PM To: [EMAIL PROTECTED] Subject: Re: [WSG] Cool No-delay image rollover technique I experience the same issue as Peter in Firefox with caching turned off. (although I don't see a delay, I know it's loading a fresh copy of the image when the firewall winks at me every time I roll over tabs on the Fast Company web site.) Here's a real purdy looking tutorial from Dan Cedarholm, note the comments bring up this very issue. http://www.simplebits.com/archives/2003/09/30/accessible_imagetab_rollovers. html I agree with Peter, it's a clean way to handle roll-overs. And the majority of users might have caching turned on. Otherwise if you follow the link at the bottom of the Pixy tutorial, there's a simple band-aid. Regards, Ben Peter Firminger wrote: I know I have my browser (IE 6 WinXP Pro) set to not cache anything, but this method doesn't work for me. Over a second delay on rollover and roll off with a blank space in the meantime. It makes no difference to a _javascript_ preload at all. Much better code though so I'm not canning it. *From:* Michael Kear ** Using this technique you can get all the graphical/ 3d advantages of _javascript_ rollovers, but instead of _javascript_ it uses CSS to move an image around giving the rollover effect. The article's at http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/ * The discussion list for http://webstandardsgroup.org/ * * The discussion list for http://webstandardsgroup.org/ * -- Ryan Christie [EMAIL PROTECTED] http://www.theward.net * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Need help with navbar in Opera 7.11 please
Good evening David, It was foretold that on 16-2-2004 @ 08:44:57 GMT+1100 (which was 22:44:57 where I live) David McDonald would mumble: DM> Make sure all floats have a width - Opera is particularly demanding about DM> this. Not demanding, just implementing the specs how they should be: "A floated box must have an explicit width" as per spec: http://www.w3.org/TR/REC-CSS2/visuren.html#floats ;-) -- Best regards, Luc _ http://www.dzinelabs.com Powered by The Bat! version 1.63 Beta/7 with Windows 2000 (build 2195), version 5.0 Service Pack 4 and using the best browser: Opera. "You have not really failed or been defeated unless you believe it." * The discussion list for http://webstandardsgroup.org/ *
RE: [WSG] Need help with navbar in Opera 7.11 please
Michael, Make sure all floats have a width - Opera is particularly demanding about this. Regards, David McDonald Web Designer http://www.davidmcdonald.org Southbank, Melbourne Australia Mobile: 0403 332 140 ICQ: 11814164 -Original Message- From: Michael Kear [mailto:[EMAIL PROTECTED] Sent: Tuesday, 17 February 2004 2:16 AM To: [EMAIL PROTECTED] Subject: [WSG] Need help with navbar in Opera 7.11 please I've put this page up on my dev site, and it works fine in IE6, fine in NN7.1, but in Opera 7.11 the lower level of menus are arranged vertically instead of horizontally. I'm not sure what's wrong - they worked ok this afternoon, now I've made some changes and they don't work. "Easy," I said to myself, "just put it back how it was this afternoon and it'll work again, then do the changes one at a time till it breaks then you'll know what you did wrong." Except when I loaded up this afternoon's version it still arranges the submenus vertically. Huh? I've looked and looked and I'm obviously too close to it because I cant see what's causing it to behave like that. Can anyone else see please? The page is at http://mezzanines.com.au/casestudies.cfm And the CSS is at http://mezzanines.com.au/styles/mezzanine.css and http://mezzanines.com.au/styles/menutabs.css I'm fully aware that the problem is probably going to end up being something stupid like a forgotten semicolon or something, but it verifies ok and so does the XHTML. (Oh and in case anyone's done some work in this field - all the text is stuff I've mocked up for the client - he's busily writing his own text now.) Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com * The discussion list for http://webstandardsgroup.org/ * * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] CSS toolkit
Good evening Carl, It was foretold that on 16-2-2004 @ 13:09:38 GMT-0500 (which was 19:09:38 where I live) Carl Reynolds would mumble: CR> I was not aware that there are toolkits for checking CSS. The official one and free: http://jigsaw.w3.org/css-validator/ -- Best regards, Luc _ http://www.dzinelabs.com Powered by The Bat! version 1.63 Beta/7 with Windows 2000 (build 2195), version 5.0 Service Pack 4 and using the best browser: Opera. "Xerox never comes up with anything original." * The discussion list for http://webstandardsgroup.org/ *
[WSG] CSS toolkit
On Saturday Ben Bishop wrote: Without my trusty toolkit handy, I can't answer why it is breaking, in response to a question from James. I was not aware that there are toolkits for checking CSS. Would you please tell us a little more about what is in the toolkit and where we can get one? Carl. * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Need help with navbar in Opera 7.11 please
Hi Michael it's also broken in IE5.5 w2k. A quick and dirty Tip: Set display:inline; in your #subnav li selector and delete float:left; or complete it with a width-value. Greetings Stefan >--- "Michael Kear" <[EMAIL PROTECTED]> wrote: > >I've put this page up on my dev site, and it works fine in IE6, fine in >NN7.1, but in Opera 7.11 the lower level of menus are arranged vertically >instead of horizontally. I'm not sure what's wrong - they worked ok this >afternoon, now I've made some changes and they don't work. > >"Easy," I said to myself, "just put it back how it was this afternoon and >it'll work again, then do the changes one at a time till it breaks then >you'll know what you did wrong." Except when I loaded up this afternoon's >version it still arranges the submenus vertically. Huh? I've looked and >looked and I'm obviously too close to it because I cant see what's causing >it to behave like that. Can anyone else see please? > >The page is at http://mezzanines.com.au/casestudies.cfm > >And the CSS is at http://mezzanines.com.au/styles/mezzanine.css and >http://mezzanines.com.au/styles/menutabs.css > >I'm fully aware that the problem is probably going to end up being something >stupid like a forgotten semicolon or something, but it verifies ok and so >does the XHTML. > >(Oh and in case anyone's done some work in this field - all the text is >stuff I've mocked up for the client - he's busily writing his own text now.) > > >Cheers >Mike Kear >Windsor, NSW, Australia >AFP Webworks >http://afpwebworks.com > > > > >* >The discussion list for http://webstandardsgroup.org/ >* > > > >_ >Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ >Great Prices! Starting @ $8.75 Go: http://www.idotz.net >* >The discussion list for http://webstandardsgroup.org/ >* > > * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Hover issue
Hi Michael...thanks very much for your help with the CSS in my draft. You can now view it @ http://lc55.co.uk/test/index.html with the CSS @ http://lc55.co.uk/test/l.css I am humbled by your knowledge and extremely grateful to find a friend like yourself on the WSG. Kindest regards, JG PS I changed and moved the background image, again!!! If I have made another hash of things anywhere, please inform me. _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Need help with navbar in Opera 7.11 please
Hi Michael...This may be some help to others as to how it actually looks in Opera 7. A cut-off screenshot of your problem: http://lc55.co.uk/test/mfs.jpg Regards, JG --- "Michael Kear" <[EMAIL PROTECTED]> wrote: I've put this page up on my dev site, and it works fine in IE6, fine in NN7.1, but in Opera 7.11 the lower level of menus are arranged vertically instead of horizontally. I'm not sure what's wrong - they worked ok this afternoon, now I've made some changes and they don't work. "Easy," I said to myself, "just put it back how it was this afternoon and it'll work again, then do the changes one at a time till it breaks then you'll know what you did wrong." Except when I loaded up this afternoon's version it still arranges the submenus vertically. Huh? I've looked and looked and I'm obviously too close to it because I cant see what's causing it to behave like that. Can anyone else see please? The page is at http://mezzanines.com.au/casestudies.cfm And the CSS is at http://mezzanines.com.au/styles/mezzanine.css and http://mezzanines.com.au/styles/menutabs.css I'm fully aware that the problem is probably going to end up being something stupid like a forgotten semicolon or something, but it verifies ok and so does the XHTML. (Oh and in case anyone's done some work in this field - all the text is stuff I've mocked up for the client - he's busily writing his own text now.) Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com * The discussion list for http://webstandardsgroup.org/ * _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ *
[WSG] Need help with navbar in Opera 7.11 please
I've put this page up on my dev site, and it works fine in IE6, fine in NN7.1, but in Opera 7.11 the lower level of menus are arranged vertically instead of horizontally. I'm not sure what's wrong - they worked ok this afternoon, now I've made some changes and they don't work. "Easy," I said to myself, "just put it back how it was this afternoon and it'll work again, then do the changes one at a time till it breaks then you'll know what you did wrong." Except when I loaded up this afternoon's version it still arranges the submenus vertically. Huh? I've looked and looked and I'm obviously too close to it because I cant see what's causing it to behave like that. Can anyone else see please? The page is at http://mezzanines.com.au/casestudies.cfm And the CSS is at http://mezzanines.com.au/styles/mezzanine.css and http://mezzanines.com.au/styles/menutabs.css I'm fully aware that the problem is probably going to end up being something stupid like a forgotten semicolon or something, but it verifies ok and so does the XHTML. (Oh and in case anyone's done some work in this field - all the text is stuff I've mocked up for the client - he's busily writing his own text now.) Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Hover issue
Should be commented to show anything major done: <> MD On Feb 16, 2004, at 07:08, LC 55 wrote: Michael, Peter and Lucian appreciate the feedback. I'm still on a steep learning curve. Firstly Michael, I was under the illusion if you tried to use the W3C CSS validator with a ".html" extension, you wouldn't have a hope of getting it to validate, as surely it is a ".css" only validator? Therefore how can it validate .html? (jigsaw validator, I mean). You'll probably have a simple explanation for me, I hope so, as I'm getting a bit lost with this one. As i said, I'm still quite green to this myself. Also I know the CSS is untidy re: double ids etc. (still working on it). New draft version at http://lc55.co.uk/test/index.html (where I have moved the background image to top right). and the uncondensed CSS draft is at http://lc55.co.uk/test/d.css Help with condensing the CSS would be very appreciated if any of you guys can spare the time. Hope I'm not boring you guys to much, but I suppose we are all here to learn from each other. Thanks again, JG --- Michael Donnermeyer <[EMAIL PROTECTED]> wrote: http://jigsaw.w3.org/css-validator/validator? uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Findex.html Here's the issue in your #container: margin-bottom: 0 auto; You can't have two values here. Correct ones would be:: margin-bottom: 0ormargin-bottom: auto Were you trying this maybe::margin: 0 auto(0 on top & bottom, auto for left and right) The CSS could use some cleaning, looks like there's some doubles in there (ids) and alot of double stating on things like background in some ids. I.E.: #container { width : 100%; margin: 0 auto; background : url(img/xr.gif) repeat 100% 50%; background-repeat : no-repeat; background-position : 100% 100%; background-color : #d4dfd1; font-family : "Trebuchet MS", "Lucida Grande", Verdana, Arial, sans-serif; font-size : 0.9em; color : #333; line-height : 115%; } Two questions arise there...in one you have it repeat, then you don't. You have it position 100% 50% then 100% 100%. The later of the two override the first ones. Be easier to condense everything into: background: #d4dfd1 url("img/xr,gif") no-repeat bottom right; MD On Feb 16, 2004, at 04:08, LC 55 wrote: Thanks Lucian for the feedback. I am puzzled re: you writing, "The CSS doesn't validate". W3C validator was used and, the uri below validates it as CSS2. Hope the W3C were not just being kind to me! http://jigsaw.w3.org/css-validator/validator? uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Fd.css&warning=1&profile=css2&user m edium=all Strange one this. So could you tell me where you tried the validation, please? Appreciate you testing it for me. Regards, JG --- Lucian Teo <[EMAIL PROTECTED]> wrote: Looks great on IE / Mac, Safari and Firefox / Mac. CSS doesn't yet validate though. :) Lucian On Feb 16, 2004, at 4:01 PM, LC 55 wrote: Hi all... Anyone care to check - http://lc55.co.uk/test/index.html please. I have a problem in IE 6 re: background image. The image at bottom right moves slightly down the page when hovering over footer links. Does the same problem exist across other browsers? Or are you finding any other problems? Any help appreciated. Regards, JG _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ * * The discussion list for http://webstandardsgroup.org/ * _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ * _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] link: emulating max-width in IE!!!
Justin French wrote: Hi all, found this morning on my usual blog crawl: http://www.svendtofte.com/code/max_width_in_ie/ The fun begins if you want max-width in ems and want to support quirks and standards mode. But its possible. I would recommend to create a JavaScript function, and call it in the expression. http://msdn.microsoft.com/workshop/author/dhtml/overview/recalc.asp http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/compatmode.asp Tonico -- Tonico Strasser ?:-) http://Tonico.FreeZope.org Contact_Tonico at Yahoo dot de Check out http://www.WebProducer.at * The discussion list for http://webstandardsgroup.org/ *
RE: [WSG] CSS Rules - Naming Conventions
O jeez.. I was just about to launch a site with heading area called banner. Good point, I think you're right, Andy. Gotta go change it before the launch. Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com -Original Message- From: Andy Budd [mailto:[EMAIL PROTECTED] Sent: Monday, 16 February 2004 10:25 PM To: [EMAIL PROTECTED] Subject: Re: [WSG] CSS Rules - Naming Conventions Don't call anything banner. I've done this on several sites only to find some ad blocking software simply filters out elements with this name. Andy Budd http://www.message.uk.com/ * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Hover issue
It's not validating the html, but the CSS file based off the link contained within the HTML file...just like a browser would see the file. The only problem in there per the validator was the margin-bottom issue. After that's fixed, and everything's cleaned, it shouldn't have a problem validating. MD On Feb 16, 2004, at 07:08, LC 55 wrote: Michael, Peter and Lucian appreciate the feedback. I'm still on a steep learning curve. Firstly Michael, I was under the illusion if you tried to use the W3C CSS validator with a ".html" extension, you wouldn't have a hope of getting it to validate, as surely it is a ".css" only validator? Therefore how can it validate .html? (jigsaw validator, I mean). You'll probably have a simple explanation for me, I hope so, as I'm getting a bit lost with this one. As i said, I'm still quite green to this myself. Also I know the CSS is untidy re: double ids etc. (still working on it). New draft version at http://lc55.co.uk/test/index.html (where I have moved the background image to top right). and the uncondensed CSS draft is at http://lc55.co.uk/test/d.css Help with condensing the CSS would be very appreciated if any of you guys can spare the time. Hope I'm not boring you guys to much, but I suppose we are all here to learn from each other. Thanks again, JG * The discussion list for http://webstandardsgroup.org/ *
RE: [WSG] Cool No-delay image rollover technique
Wouldn't you get the same effect with old-fashioned javascript rollovers if you have caching turned off? I remember the first attempt I made at doing rollovers using the dreamweaver behaviour, I couldn't figure out how come it worked beautifully on my local machine but not on the web. Till I realised I had caching turned off and the images were loading every time. Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com -Original Message- From: Ben Bishop [mailto:[EMAIL PROTECTED] Sent: Monday, 16 February 2004 10:45 PM To: [EMAIL PROTECTED] Subject: Re: [WSG] Cool No-delay image rollover technique I experience the same issue as Peter in Firefox with caching turned off. (although I don't see a delay, I know it's loading a fresh copy of the image when the firewall winks at me every time I roll over tabs on the Fast Company web site.) Here's a real purdy looking tutorial from Dan Cedarholm, note the comments bring up this very issue. http://www.simplebits.com/archives/2003/09/30/accessible_imagetab_rollovers. html I agree with Peter, it's a clean way to handle roll-overs. And the majority of users might have caching turned on. Otherwise if you follow the link at the bottom of the Pixy tutorial, there's a simple band-aid. Regards, Ben Peter Firminger wrote: > I know I have my browser (IE 6 WinXP Pro) set to not cache anything, > but this method doesn't work for me. Over a second delay on rollover > and roll off with a blank space in the meantime. It makes no > difference to a JavaScript preload at all. Much better code though so > I'm not canning it. > > *From:* Michael Kear > ** > > Using this technique you can get all the graphical/ 3d advantages > of javascript rollovers, but instead of javascript it uses CSS to > move an image around giving the rollover effect. > > The article's at > http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/ > * The discussion list for http://webstandardsgroup.org/ * * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Hover issue
Pardon my ignorance please. I tried the CSS validator using http://lc55.co.uk/test/index.html and got this result... http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Findex.html&warning=1&profile=css2&usermedium=all Thanks for pointing this out Michael. (a very red face at this end). Regards, JG --- LC 55 <[EMAIL PROTECTED]> wrote: Michael, Peter and Lucian appreciate the feedback. I'm still on a steep learning curve. Firstly Michael, I was under the illusion if you tried to use the W3C CSS validator with a ".html" extension, you wouldn't have a hope of getting it to validate, as surely it is a ".css" only validator? Therefore how can it validate .html? (jigsaw validator, I mean). You'll probably have a simple explanation for me, I hope so, as I'm getting a bit lost with this one. As i said, I'm still quite green to this myself. Also I know the CSS is untidy re: double ids etc. (still working on it). New draft version at http://lc55.co.uk/test/index.html (where I have moved the background image to top right). and the uncondensed CSS draft is at http://lc55.co.uk/test/d.css Help with condensing the CSS would be very appreciated if any of you guys can spare the time. Hope I'm not boring you guys to much, but I suppose we are all here to learn from each other. Thanks again, JG --- Michael Donnermeyer <[EMAIL PROTECTED]> wrote: http://jigsaw.w3.org/css-validator/validator? uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Findex.html Here's the issue in your #container: margin-bottom: 0 auto; You can't have two values here. Correct ones would be:: margin-bottom: 0ormargin-bottom: auto Were you trying this maybe::margin: 0 auto(0 on top & bottom, auto for left and right) The CSS could use some cleaning, looks like there's some doubles in there (ids) and alot of double stating on things like background in some ids. I.E.: #container { width : 100%; margin: 0 auto; background : url(img/xr.gif) repeat 100% 50%; background-repeat : no-repeat; background-position : 100% 100%; background-color : #d4dfd1; font-family : "Trebuchet MS", "Lucida Grande", Verdana, Arial, sans-serif; font-size : 0.9em; color : #333; line-height : 115%; } Two questions arise there...in one you have it repeat, then you don't. You have it position 100% 50% then 100% 100%. The later of the two override the first ones. Be easier to condense everything into: background: #d4dfd1 url("img/xr,gif") no-repeat bottom right; MD On Feb 16, 2004, at 04:08, LC 55 wrote: > > Thanks Lucian for the feedback. > I am puzzled re: you writing, "The CSS doesn't validate". > W3C validator was used and, the uri below validates it as CSS2. > Hope the W3C were not just being kind to me! > > http://jigsaw.w3.org/css-validator/validator? > uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Fd.css&warning=1&profile=css2&userm > edium=all > > Strange one this. > So could you tell me where you tried the validation, please? > > Appreciate you testing it for me. > Regards, JG > > --- Lucian Teo <[EMAIL PROTECTED]> wrote: > > Looks great on IE / Mac, Safari and Firefox / Mac. > > CSS doesn't yet validate though. :) > > Lucian > > On Feb 16, 2004, at 4:01 PM, LC 55 wrote: > >> >> Hi all... >> >> Anyone care to check - http://lc55.co.uk/test/index.html please. >> I have a problem in IE 6 re: background image. >> The image at bottom right moves slightly down the page when hovering >> over footer links. >> >> Does the same problem exist across other browsers? >> Or are you finding any other problems? >> >> Any help appreciated. >> Regards, JG >> >> >> >> >> _ >> Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers >> Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net >> * >> The discussion list for http://webstandardsgroup.org/ >> * >> >> >> > > * > The discussion list for http://webstandardsgroup.org/ > * > > > > _ > Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers > Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net > * > The discussion list for http://webstandardsgroup.org/ > * > _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list f
Re: [WSG] Hover issue
Michael, Peter and Lucian appreciate the feedback. I'm still on a steep learning curve. Firstly Michael, I was under the illusion if you tried to use the W3C CSS validator with a ".html" extension, you wouldn't have a hope of getting it to validate, as surely it is a ".css" only validator? Therefore how can it validate .html? (jigsaw validator, I mean). You'll probably have a simple explanation for me, I hope so, as I'm getting a bit lost with this one. As i said, I'm still quite green to this myself. Also I know the CSS is untidy re: double ids etc. (still working on it). New draft version at http://lc55.co.uk/test/index.html (where I have moved the background image to top right). and the uncondensed CSS draft is at http://lc55.co.uk/test/d.css Help with condensing the CSS would be very appreciated if any of you guys can spare the time. Hope I'm not boring you guys to much, but I suppose we are all here to learn from each other. Thanks again, JG --- Michael Donnermeyer <[EMAIL PROTECTED]> wrote: http://jigsaw.w3.org/css-validator/validator? uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Findex.html Here's the issue in your #container: margin-bottom: 0 auto; You can't have two values here. Correct ones would be:: margin-bottom: 0ormargin-bottom: auto Were you trying this maybe::margin: 0 auto(0 on top & bottom, auto for left and right) The CSS could use some cleaning, looks like there's some doubles in there (ids) and alot of double stating on things like background in some ids. I.E.: #container { width : 100%; margin: 0 auto; background : url(img/xr.gif) repeat 100% 50%; background-repeat : no-repeat; background-position : 100% 100%; background-color : #d4dfd1; font-family : "Trebuchet MS", "Lucida Grande", Verdana, Arial, sans-serif; font-size : 0.9em; color : #333; line-height : 115%; } Two questions arise there...in one you have it repeat, then you don't. You have it position 100% 50% then 100% 100%. The later of the two override the first ones. Be easier to condense everything into: background: #d4dfd1 url("img/xr,gif") no-repeat bottom right; MD On Feb 16, 2004, at 04:08, LC 55 wrote: > > Thanks Lucian for the feedback. > I am puzzled re: you writing, "The CSS doesn't validate". > W3C validator was used and, the uri below validates it as CSS2. > Hope the W3C were not just being kind to me! > > http://jigsaw.w3.org/css-validator/validator? > uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Fd.css&warning=1&profile=css2&userm > edium=all > > Strange one this. > So could you tell me where you tried the validation, please? > > Appreciate you testing it for me. > Regards, JG > > --- Lucian Teo <[EMAIL PROTECTED]> wrote: > > Looks great on IE / Mac, Safari and Firefox / Mac. > > CSS doesn't yet validate though. :) > > Lucian > > On Feb 16, 2004, at 4:01 PM, LC 55 wrote: > >> >> Hi all... >> >> Anyone care to check - http://lc55.co.uk/test/index.html please. >> I have a problem in IE 6 re: background image. >> The image at bottom right moves slightly down the page when hovering >> over footer links. >> >> Does the same problem exist across other browsers? >> Or are you finding any other problems? >> >> Any help appreciated. >> Regards, JG >> >> >> >> >> _ >> Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers >> Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net >> * >> The discussion list for http://webstandardsgroup.org/ >> * >> >> >> > > * > The discussion list for http://webstandardsgroup.org/ > * > > > > _ > Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers > Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net > * > The discussion list for http://webstandardsgroup.org/ > * > _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Cool No-delay image rollover technique
I experience the same issue as Peter in Firefox with caching turned off. (although I don't see a delay, I know it's loading a fresh copy of the image when the firewall winks at me every time I roll over tabs on the Fast Company web site.) Here's a real purdy looking tutorial from Dan Cedarholm, note the comments bring up this very issue. http://www.simplebits.com/archives/2003/09/30/accessible_imagetab_rollovers.html I agree with Peter, it's a clean way to handle roll-overs. And the majority of users might have caching turned on. Otherwise if you follow the link at the bottom of the Pixy tutorial, there's a simple band-aid. Regards, Ben Peter Firminger wrote: I know I have my browser (IE 6 WinXP Pro) set to not cache anything, but this method doesn't work for me. Over a second delay on rollover and roll off with a blank space in the meantime. It makes no difference to a JavaScript preload at all. Much better code though so I'm not canning it. *From:* Michael Kear ** Using this technique you can get all the graphical/ 3d advantages of javascript rollovers, but instead of javascript it uses CSS to move an image around giving the rollover effect. The article’s at http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/ * The discussion list for http://webstandardsgroup.org/ *
RE: [WSG] Cool No-delay image rollover technique
I know I have my browser (IE 6 WinXP Pro) set to not cache anything, but this method doesn't work for me. Over a second delay on rollover and roll off with a blank space in the meantime. It makes no difference to a _javascript_ preload at all. Much better code though so I'm not canning it. P. From: Michael Kear [mailto:[EMAIL PROTECTED] Sent: Monday, February 16, 2004 10:11 PMTo: [EMAIL PROTECTED]Subject: [WSG] Cool No-delay image rollover technique In a newsletter dropped into my inbox today was a reference to a great little article on how to get no-delay image rollovers using css positioning to get the rollover effect instead of _javascript_. Using this technique you can get all the graphical/ 3d advantages of _javascript_ rollovers, but instead of _javascript_ it uses CSS to move an image around giving the rollover effect. The article’s at http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/ Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com
Re: [WSG] CSS Rules - Naming Conventions
Don't call anything banner. I've done this on several sites only to find some ad blocking software simply filters out elements with this name. Andy Budd http://www.message.uk.com/ * The discussion list for http://webstandardsgroup.org/ *
[WSG] Cool No-delay image rollover technique
In a newsletter dropped into my inbox today was a reference to a great little article on how to get no-delay image rollovers using css positioning to get the rollover effect instead of _javascript_. Using this technique you can get all the graphical/ 3d advantages of _javascript_ rollovers, but instead of _javascript_ it uses CSS to move an image around giving the rollover effect. The article’s at http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/ Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com
Re: [WSG] Hover issue
http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Findex.html Here's the issue in your #container: margin-bottom: 0 auto; You can't have two values here. Correct ones would be:: margin-bottom: 0ormargin-bottom: auto Were you trying this maybe::margin: 0 auto(0 on top & bottom, auto for left and right) The CSS could use some cleaning, looks like there's some doubles in there (ids) and alot of double stating on things like background in some ids. I.E.: #container { width : 100%; margin: 0 auto; background : url(img/xr.gif) repeat 100% 50%; background-repeat : no-repeat; background-position : 100% 100%; background-color : #d4dfd1; font-family : "Trebuchet MS", "Lucida Grande", Verdana, Arial, sans-serif; font-size : 0.9em; color : #333; line-height : 115%; } Two questions arise there...in one you have it repeat, then you don't. You have it position 100% 50% then 100% 100%. The later of the two override the first ones. Be easier to condense everything into: background: #d4dfd1 url("img/xr,gif") no-repeat bottom right; MD On Feb 16, 2004, at 04:08, LC 55 wrote: Thanks Lucian for the feedback. I am puzzled re: you writing, "The CSS doesn't validate". W3C validator was used and, the uri below validates it as CSS2. Hope the W3C were not just being kind to me! http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Fd.css&warning=1&profile=css2&usermedium=all Strange one this. So could you tell me where you tried the validation, please? Appreciate you testing it for me. Regards, JG --- Lucian Teo <[EMAIL PROTECTED]> wrote: Looks great on IE / Mac, Safari and Firefox / Mac. CSS doesn't yet validate though. :) Lucian On Feb 16, 2004, at 4:01 PM, LC 55 wrote: Hi all... Anyone care to check - http://lc55.co.uk/test/index.html please. I have a problem in IE 6 re: background image. The image at bottom right moves slightly down the page when hovering over footer links. Does the same problem exist across other browsers? Or are you finding any other problems? Any help appreciated. Regards, JG _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ * * The discussion list for http://webstandardsgroup.org/ * _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ *
RE: [WSG] Hover issue
Hi JG, If you validate the page using the HTML validator, there is a link to check the CSS as well and this parses the page to validate the CSS (easier than validating all the CSS files individually if you have more than one and more correct as it uses the parsing tree). So go to: http://validator.w3.org/check?uri=http://lc55.co.uk/test/index.html (perfect!) and there is a link that says: "If you use CSS in your document, you should also check it for validity using the W3C CSS Validation Service." Click on "check it for validity" and you'll get: http://jigsaw.w3.org/css-validator/validator?uri=http://lc55.co.uk/test/inde x.html Errors URI : http://lc55.co.uk/test/d.css Line: 0 Context : #container Invalid number : margin-bottomToo many values or values are not recognized : 0 auto Line: 0 Context : #container Invalid number : margin-bottomToo many values or values are not recognized : 0 auto _ Now.. Why is this so? Sorry, I can't help you there right now, but probably something to do with the parsing tree. So why the commented stuff in: /**/ P > -Original Message- > From: LC 55 [mailto:[EMAIL PROTECTED] > Sent: Monday, February 16, 2004 8:09 PM > To: [EMAIL PROTECTED] > Subject: Re: [WSG] Hover issue > > > Thanks Lucian for the feedback. > I am puzzled re: you writing, "The CSS doesn't validate". > W3C validator was used and, the uri below validates it as CSS2. > Hope the W3C were not just being kind to me! > > http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2F lc55.co.uk%2Ftest%2Fd.css&warning=1&profile=css2&usermedium=all > > Strange one this. > So could you tell me where you tried the validation, please? > > Appreciate you testing it for me. > Regards, JG > > --- Lucian Teo <[EMAIL PROTECTED]> wrote: > > Looks great on IE / Mac, Safari and Firefox / Mac. > > CSS doesn't yet validate though. :) > > Lucian > > On Feb 16, 2004, at 4:01 PM, LC 55 wrote: > > > > > Hi all... > > > > Anyone care to check - http://lc55.co.uk/test/index.html please. > > I have a problem in IE 6 re: background image. > > The image at bottom right moves slightly down the page when > hovering > > over footer links. > > > > Does the same problem exist across other browsers? > > Or are you finding any other problems? > > > > Any help appreciated. > > Regards, JG > > > > > > > > > > _ > > Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers > > Cool Domains @ Great Prices! Starting @ $8.75 Go: > http://www.idotz.net > > * > > The discussion list for http://webstandardsgroup.org/ > > * > > > > > > > > * > The discussion list for http://webstandardsgroup.org/ > * > > > > _ > Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net > offers Cool Domains @ Great Prices! Starting @ $8.75 Go: > http://www.idotz.net > * > The discussion list for http://webstandardsgroup.org/ > * > * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] CSS Rules - Naming Conventions
Basic ids: container header content nav footer Others: navlist menu spacer On Feb 16, 2004, at 00:23, Stumpy wrote: Just wondering what peoples thoughts/methods are when naming your DIV's, ID's, etc. I vaguely remember IE4 not supporting underscores or hyphens, and therefore use camel case, but I'm wondering if people use various standard names like container, body, header, footer, etc... Cheers, Craig Try the new improved Yahoo! Australia & NZ Search at http://www.yahoo.com.au * The discussion list for http://webstandardsgroup.org/ * * The discussion list for http://webstandardsgroup.org/ *
[WSG] text size controls
Title: text size controls so I need some text size controls on a news article page, and while I can easily comprehend the method behind the style switcher method that is everywhere to switch between a few preset sizes - like www.wired.com - I'd like to use the " + / - " method that you see around the place.. say , like here: http://www.sacbee.com/content/business/story/8273039p-9203704c.html that allows you to bump up the size progressively and limits you at either extreme of sizing. question is, the options for the " + / - " method I've seen use _javascript_ that seems a little excessive - in saying that tho I know next to nothing about writing _javascript_ (i'm a copier and paster in that department :). Can anyone point me to a particularly ellegant execution or tutorial for a " + / - " text size method? obviously keen to keep it all on track & standards based aswell :) should also mention my site css uses keywords to define the base font size and %'s for variations. I like the idea of the wired.com method cause i can specifically target the article body copy and have it enlarge it quite a bit, but limit the 'enlarging' (?) of navigation to a smaller increment so as not to break it. i'm not sure the " + / - " method is going to allow me that much control...? any help appreciated. pete
Re: [WSG] Hover issue
Thanks Lucian for the feedback. I am puzzled re: you writing, "The CSS doesn't validate". W3C validator was used and, the uri below validates it as CSS2. Hope the W3C were not just being kind to me! http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Flc55.co.uk%2Ftest%2Fd.css&warning=1&profile=css2&usermedium=all Strange one this. So could you tell me where you tried the validation, please? Appreciate you testing it for me. Regards, JG --- Lucian Teo <[EMAIL PROTECTED]> wrote: Looks great on IE / Mac, Safari and Firefox / Mac. CSS doesn't yet validate though. :) Lucian On Feb 16, 2004, at 4:01 PM, LC 55 wrote: > > Hi all... > > Anyone care to check - http://lc55.co.uk/test/index.html please. > I have a problem in IE 6 re: background image. > The image at bottom right moves slightly down the page when hovering > over footer links. > > Does the same problem exist across other browsers? > Or are you finding any other problems? > > Any help appreciated. > Regards, JG > > > > > _ > Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers > Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net > * > The discussion list for http://webstandardsgroup.org/ > * > > > * The discussion list for http://webstandardsgroup.org/ * _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Hover issue
Looks great on IE / Mac, Safari and Firefox / Mac. CSS doesn't yet validate though. :) Lucian On Feb 16, 2004, at 4:01 PM, LC 55 wrote: Hi all... Anyone care to check - http://lc55.co.uk/test/index.html please. I have a problem in IE 6 re: background image. The image at bottom right moves slightly down the page when hovering over footer links. Does the same problem exist across other browsers? Or are you finding any other problems? Any help appreciated. Regards, JG _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ * * The discussion list for http://webstandardsgroup.org/ *
[WSG] New CSS Site Layout
Can you please quickly checkout: http://www.toolmantim.com/staging/playtest.html and tell me if it looks ok in your browser. Also, does anybody know how to fix the disappearing footer colour when the window is resized very small? I'm quite sure it has to do with collapsing margins but I can't figure out which ones. -- tim Oh and btw if anybody needs a pseudo-latin-text generator i've had this tucked away for a while: http://www.toolmantim.com/tools/latin.php The difference between this and http://www.lipsum.com/ is that mine includes the source * The discussion list for http://webstandardsgroup.org/ *
[WSG] Hover issue
Hi all... Anyone care to check - http://lc55.co.uk/test/index.html please. I have a problem in IE 6 re: background image. The image at bottom right moves slightly down the page when hovering over footer links. Does the same problem exist across other browsers? Or are you finding any other problems? Any help appreciated. Regards, JG _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ *