Re: [WSG] Styling of input type=file
This element is generally 'unstylable' for security reasons; namely ensuring the user is aware of what they're doing. Did you search first? http://www.google.com/search?q=CSS+input+type%3D%22file%22start=0ie=utf-8oe=utf-8client=firefox-arls=org.mozilla:en-US:official The first result is about as good of write up as you're likely to find. On 3/10/06, Soeren Mordhorst [EMAIL PROTECTED] wrote: Dear WSG, for an input type=file we like to design the button and, if possible, the background-color for focus. Does anybody know how to do that? The link in the fieldset 'Upload a file to the W3C Validator.': http://www.webnauts.net/redesign/check.html Thanks in advance! All the best, Soeren ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** -- http://leftjustified.net/ ~ Show me one user that actually needs a 'reset' button on a web form and I'll show you 50 that clicked it by mistake and left your site in disgust. :)
Re: [WSG] Correct MIME types for non-standard file formats
On 1/24/06, Peter Levan [EMAIL PROTECTED] wrote: Without the MIME type set the file displays like a text file in the browser window, however we want the download requestor to appear when accessing a file of this type as the file is useless when viewed as straight text as it is a data file designed to be used with SPSS. The most common way of forcing a download is to use the .exe mimetype -- 'application/octet-stream' If you're using Apache, you can place the following in the .htaccess file for the folder holding the .por files. This will ensure that the files are always downloaded, even if the files location is entered via the address bar. (the alternative option being store the files above the root directory and only allow the download script to access them) Files *.por ForceType application/octet-stream /Files HTH, Andrew. -- http://leftjustified.net/ N���.�Ȩ�X���+��i�� n�Z�֫v�+��h��y�m�쵩�j�l��.f���.�ץ�w�q(��b��(��,�)උazX����)��
Re: [WSG] Best Web Standards thing I learnt in 2005.
Best new bit of knowledge for me in 2005? XSL. If you know and enjoy using CSS, dive into XSL; it'll rock your world :) hoping everyone has a safe and happy holiday season, Andrew.
Re: [WSG] Source Attribution for data tables
On 12/19/05, Terrence Wood [EMAIL PROTECTED] wrote: how would/do you markup the source attribution for data tables when there is already a caption? How about using the tfoot element? You could code it as: table thead tr thSummary of Key Indicators/th /tr /thead tfoot tr tdSource: citeFoo Corp 2005/cite/td /tr /tfoot tbody ... table content ... /tbody /table The tfoot is always displayed at the bottom of the table and can also be used in a 'scrolling content, fixed header+footer' table setup. hth, Andrew.
Re: [WSG] javascripts and standards
On 10/17/05, Mordechai Peller [EMAIL PROTECTED] wrote: One of the best books on JavaScript is: JavaScript: The Definitive Guide, by David Flanagan (O'Reilly Associates, Inc.) Couldn't agree more. A fantastic reference manual that will remain on my desk for years to come. Here's the complete 4th edition online: http://157.26.64.29/OReilly_books/books/webprog/jscript/index.htm found via: http://www.maththinking.com/boat/booksIndex.html I *believe* it's legal... fingers crossed! -Andrew.
Re: [WSG] javascripts and standards
My sincerest apologies to the group regarding the links in my previous post. Youthful naivety shines through once more :-o Please keep any further abuse off-list; it's not relevant to the thread. :) On 10/17/05, Mark Harris [EMAIL PROTECTED] wrote: Andrew Krespanis wrote: Here's the complete 4th edition online: http://157.26.64.29/OReilly_books/books/webprog/jscript/index.htm found via: http://www.maththinking.com/boat/booksIndex.html I *believe* it's legal... fingers crossed! and the Tooth Fairy, I suppose? ;-) f you have found this CD Bookshelf on the web, or it is a copy of an original, then you have an unauthorized, infringing copy. Authorized, lawful, non-infringing copies of this product can be purchased from O'Reilly Associates, Inc. and I see Kevin Futter has just posted the URL for the above statement mark ** 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 ** -- http://leftjustified.net/ ~ Show me one user that actually needs a 'reset' button on a web form and I'll show you 50 that clicked it by mistake and left your site in disgust. :)
Re: [WSG] Say no to CSS hacks with branching techniques
On 10/9/05, Thierry Koblentz [EMAIL PROTECTED] wrote: That's totally irrelevant. If 2 days ago you knew your article was flawed then why posting a link to it? I only mentioned it because it was published exactly 365 days earlier on a very similar topic (linking CSS to html files). I was amused by this fact. Lets not get so deep, eh people? :)
Re: [WSG] Say no to CSS hacks with branching techniques
On 10/8/05, Thierry Koblentz [EMAIL PROTECTED] wrote: I'm sorry, but this doesn't make sense at all. Or is there an important detail I'm missing? ;) Yes, you're missing the part where this was written over 12 months ago by someone who had only built 3 sites and wanted to try and help other beginners navigate the 'minefield of pain' that is starting out with CSS. It's all well and good to say that's so outdated, what the heck were you thinking and you're right -- I don't use the IE filter methods anymore and I usually cater for more alternative media from the outset. I absolutely should write an updated version of my article, I don't deny much of what is discussed is now outdated.That said, I have an archive of nearly 700 emails thanking me for the methods outlined in that article alone, so I have no regrets what so ever about publishing and promoting those techniques (at the time, anyway). Let's discuss your article in 12 months and see if you still feel the same ;)
Re: [WSG] Say no to CSS hacks with branching techniques
On 10/7/05, Thierry Koblentz [EMAIL PROTECTED] wrote: I would appreciate your feedback so I can improve this article: http://www.tjkdesign.com/articles/branching.asp Sure, but I'm in a hurry so please excuse me if I'm a bit short with my reponse :) Congratulations! Now your file is ready for prime time. In the markup, below the title element, write the following: style type=text/css media=all @import url(/css/basic.css); /style media=all is a pretty presumptuous piece of advice; especially since there doesn't appear to be any instruction for beginners as to the implications of using media=all. Can your PDA fit a 800px wide fixed width layout? What about your phone? Nor can mine. ..and what use is visual style to an audio-based browser? ;) cursor:hand This is only needed for IE 6. Perhaps worth adding this detail? Have you tested that media=print on a link elements has higher precedence that media=all on style in all your supported browsers? I couldn't agree more with what you're trying to achieve, but I think there are still some important details missing :) Funnily enough, I published something rather similar exactly one year ago today: http://leftjustified.net/journal/2004/10/07/css-negotiation/ cheers, Andrew. -- http://leftjustified.net/
[WSG] Say no to CSS hacks with branching techniques [the legible version]
I must apologize for the jumbled mess that was my previous response to this thread. I have been informed that my posts come through with no line breaks and encrypted nonsense at the end. This is caused by the CustomizeGoogle firefox extension; more specifically, the 'Secure Gmail' option. I have uninstalled the extension and I'm re-posting my response on the grounds that when a copy of it was sent back to me I couldn't understand it at all, even though I had only written it 30 minutes prior. Again, sorry for creating excess noise, Andrew. -- Forwarded message -- From: Andrew Krespanis [EMAIL PROTECTED] Date: Oct 7, 2005 10:26 AM Subject: Re: [WSG] Say no to CSS hacks with branching techniques To: wsg@webstandardsgroup.org On 10/7/05, Thierry Koblentz [EMAIL PROTECTED] wrote: I would appreciate your feedback so I can improve this article: http://www.tjkdesign.com/articles/branching.asp Sure, but I'm in a hurry so please excuse me if I'm a bit short with my reponse :) Congratulations! Now your file is ready for prime time. In the markup, below the title element, write the following: style type=text/css media=all @import url(/css/basic.css); /style media=all is a pretty presumptuous piece of advice; especially since there doesn't appear to be any instruction for beginners as to the implications of using media=all. Can your PDA fit a 800px wide fixed width layout? What about your phone? Nor can mine. ..and what use is visual style to an audio-based browser? ;) cursor:hand This is only needed for IE 6. Perhaps worth adding this detail? Have you tested that media=print on a link elements has higher precedence that media=all on style in all your supported browsers? I couldn't agree more with what you're trying to achieve, but I think there are still some important details missing :) Funnily enough, I published something rather similar exactly one year ago today: http://leftjustified.net/journal/2004/10/07/css-negotiation/ cheers, Andrew. -- http://leftjustified.net/
Re: Use of cite WAS: Re: [WSG] Homepage Review: webnetdesignstudios.com
On 10/3/05, Joshua Street [EMAIL PROTECTED] wrote: So... is there any way to define this relationship? Or is it just order-of-content and hoping it makes sense? What if you were to put the cite after the quote for whatever reason (style guide convention, etc)? Sorry Josh, there's no attribute for either element to represent such a relationship. The q element can contain the cite attribute though, if the original source has a URI. Reference Cite: http://www.w3.org/TR/html401/struct/text.html#edef-CITE Q: http://www.w3.org/TR/html401/struct/text.html#edef-Q cheers, Andrew. --- http://leftjustified.net/
Re: [WSG] Using CSS for Flash backgrounds
On 9/28/05, Tom Livingston [EMAIL PROTECTED] wrote: On Tue, 27 Sep 2005 15:18:16 -0400, Joseph R. B. Taylor [EMAIL PROTECTED] wrote: CSS solution: Put the flash movie into a div, then set the big background image you'd use for the movie as the background image on the div. Bang! Flash movie much smaller, loads much faster, big image cached, everyone's happy. Any thoughts? Nice, but usually Flash can crush an image down smaller than say ImageReady/PS. Yes, it adds to the swf, but are you really saving any download time? I'd vote YES. While Flash does compress embedded bitmaps, I've always felt it does a shocking job of it. Medium sized files that look like garbage. I'd much rather use a limited palette PNG via CSS than cross my fingers and hope that Flash's JPEG algorithm doesn't destroy my image :) Thanks for the tip Joseph; I'm working on two projects at the moment that would probably benefit from this technique. cheers, Andrew.
Re: [WSG] WE05 - who's going?
I'm going. Will be doing a little 'live-bloggin' on http://notinteractive.com/ and more professional coverage on http://leftjustified.net/ I'll be up there from Wednesday night and would be keen to catch up with other WSG members for some warm up drinks :) Photo: http://static.flickr.com/18/24186038_02e84b4e96_m.jpg Ph: 0408 908 135 All intelectual interaction is warmly welcomed; try to sell me something and I'll make hell ;P See you there, Andrew. --- http://leftjustified.net/ On 9/27/05, Webmaster [EMAIL PROTECTED] wrote: So who's going to the Web Essnetials conference this week? Anyone interested in a group catch-up? I thought it might be nice to put some faces to all these names.
Re: [WSG] WE05 - who's going?
EDIT: Whoops, that first URL should be http://notinteractive.wordpress.com/ I own notinteractive.com too, but I can't find the FTP details atm and there's no redirect to the wordpress sub-domain... Good thing I don't do this stuff for a living! Oh, wait a minute 0_o On 9/27/05, Andrew Krespanis [EMAIL PROTECTED] wrote: I'm going. Will be doing a little 'live-bloggin' on http://notinteractive.com/ and more professional coverage on http://leftjustified.net/ I'll be up there from Wednesday night and would be keen to catch up with other WSG members for some warm up drinks :) Photo: http://static.flickr.com/18/24186038_02e84b4e96_m.jpg Ph: 0408 908 135 All intelectual interaction is warmly welcomed; try to sell me something and I'll make hell ;P See you there, Andrew. --- http://leftjustified.net/ On 9/27/05, Webmaster [EMAIL PROTECTED] wrote: So who's going to the Web Essnetials conference this week? Anyone interested in a group catch-up? I thought it might be nice to put some faces to all these names. -- --- http://leftjustified.net/ Lotus Notes is like radiation -- the full impact of its damage won't be obvious for generations; by which time those exposed will have passed on their malformed DNA. ;)
Re: [WSG] WE05 - who's going?
How about a secret password that you have to sneak into the first 60 seconds of meeting someone :)..? Or how about everyone interested just bites the bullet and posts their photo contact details like I just did? This secret handshake/signalling in crowded room nonsense isn't going to work. We either need know who we're looking for or decide on a place and time to meet up. -Andrew :) N���.�Ȩ�X���+��i�� n�Z�֫v�+��h��y�m�쵩�j�l��.f���.�ץ�w�q(��b��(��,�)උazX����)��
Re: [WSG] CSS Mobile Buttons
On 9/8/05, russ - maxdesign [EMAIL PROTECTED] wrote: Dunno about that but I know of two silly alternatives: A remote control device done in CSS: http://www.maxdesign.com.au/presentation/remote/remote-new.htm An IPod emulator: http://www.podsites.com/emulator-result.cfm ...and if you want it to work (able to use calculator, dial numbers and write SMS), here's a script: http://codingforums.com/showthread.php?t=37148 :) Andrew --- leftjustified.net ** 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] Browsers as copilers (was) Barclays standards redesign
On 9/9/05, Paul Bennett [EMAIL PROTECTED] wrote: although I foresee browsing with that extension may be a version of hell for many of us - can you imagine seeing the html errors for *every* page you viewed? I already see the HTML errors for every page I view [1]. The real nightmare is having the javascript console always open... so many javascript errors all over the web :( (esp. on google sites!!) [1] https://addons.mozilla.org/extensions/moreinfo.php?id=249application=firefox cheers, Andrew. http://leftjustified.net/ ** 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] divitis - a worthy goal?
On 9/9/05, Christian Montoya [EMAIL PROTECTED] wrote:
The ideal would be that your markup can have divitis, but when parsed by a
screen reader or a printing device or something else, you tell it something
along the lines of:
div {
visibilty:hidden;
}
That will hide all child elements of the div's too... not what you're after.
You would also want to add this:
div * {
visibility:visible;
}
Andrew
http://leftjustified.net/
**
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] Educate the educators (was) Barclays standards redesign
On 9/8/05, Craig Rippon [EMAIL PROTECTED] wrote: Have filed a formal complaint against the instructor (who happens to run 10 I am no longer attending his classes and may not get my Diploma. Hi Craig, Don't let it get you down, I went through exactly the same thing in '03-'04 while attending Qantm in the Brissy CBD. Fortunately for me, although most of my instructors had little to no experience with current techniques, they at least understood why I stopped attending after 6 months and instead chose to furiously study at home. I proudly state that I gained the majority of my skill set from two sources, blogs and codingforums.com (shameless plug!! ;). Attending a private college whose techniques were so behind the times taught me one very important thing: being a web developer is much like being a musician -- you either wake up every day thinking I am a student; what can I learn today? or you are retired. I don't care if you're still working -- if you're not learning, you're retired :) So, after avoiding learning outdated techniques in favour of teaching myself XHTML/CSS/unobtrusive scripting, my time studying and 5 figure bill gave me exactly what I expected it to -- a piece of paper that got me into job interviews. In Australia it's all about the piece of paper, unfortunately :( Once you're in the door, it's all about your skills. Don't talk porrly of your former learning institute, just let the interview panel know that you feared the educational sector's ability to keep up with a field that shifts focus and methods as quickly as web development; therefore, you took it upon yourself to ensure that your skills are in sync with industry standards. (or 'developing standards', in the case of early adoption of techniques/technologies). Am I full of it? Is the above advice a complete load? Well, I wrote my first HTML file in 2003 and I'm now a senior multimedia developer for a 5 campus university -- the 'dream job' I focused on for all those late, late nights in front of a glowing CRT :) all the best, Andrew. http://leftjustified.net/ ** 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] Randomly load images into the background-image selector...
On 8/24/05, Bennie, Jack [EMAIL PROTECTED] wrote: Does anyone know any neat code [JScript/CSS - not PHP] that can randomly load a selection of images into the 'background-image' selector? Should be simple. Merely dig up any decent image fade script and replace the 'image swap' with this: //obj = element whose BG you wish to animate //newImage = 'images/foo.jpg'; obj.style.backgroundImage = newImage; You may find that you need to pre-load the image in an img / element (created within DOM, but not displayed), so that the background is not initially blank when the script switches the background image src. hope that helps :) Andrew. http://leftjustified.net/ ** 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] Randomly load images into the background-image selector...
Aaaah, I over thought the situation -- I thought you wanted to *fade*
between the images, not just choose one at random...
Here you go :)
html
head
script
function randomBG(targetObjID) {
var obj, imgs, randNum;
obj = document.getElementById(targetObjID);
imgs = new Array();
imgs.push( 'foo.jpg');
imgs.push( 'bar.jpg');
imgs.push( 'w007.png');
randNum = Math.random() * (imgs.length - 1);
randNum = Math.round(randNum);
obj.style.backgroundImage = imgs[randNum];
// Uncomment followning line to test
//alert(imgs[randNum]);
}
window.onload = function() { randomBG('swapMe'); };
/script
/head
body
div id=swapMe
Test div
/div
/body
/html
Valid xhtml1.1... NOT! ;) (at least the script is
application/xhtml+xml friendly)
The next step for this script would be to adapt it to OOD, thereby
allowing other scripts to add to the imgs array without needing to
resort to global var's.
I'm 90% sure I've got a script at home that does the above, but fades
between the remaining images after choosing the initila one at
random I say 90% sure because I remember needing that
functionality for a client site but I may have ended up using an img
element due to problems with Opera 7.5 and Safari 1.1
If you're interested in that one, respond and I'll go digging tonight.
Cheers,
Andrew.
http://leftjustified.net/
**
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 columns, one fluid one fixed?
On 8/18/05, Bennie, Jack [EMAIL PROTECTED] wrote:
Got a simple one, but can't seem to get my head round it
I'm after a 2 column setup, one fixed width and the other fluid.
I'm pretty sure it's something simple, but it's the end of the day and I
can't spot it! Any ideas? I need to keep the the :float: left; in the
#centrecontent
The float:left is your problem. FF, Saf and IE/mac are correct to
freak out as floated elements *must* have a defined width except in
the case of img /'s and other objects that have their own width
determined by the media being loaded...There's a much better term for
it in the spec, but alas I'm not in the mood for spec. trawling at the
moment ;)
If that's really the main structure of the page, you don't need the
float left; in fact, you don't need the container div either:
#centrecontent {
border: 1px solid red;
margin-right:184px;
}
#right {
width:182px;
float:right;
border: 1px solid blue;
}
But you state that the float:left; needs to remain so I'm assuming
there's more to the page that you haven't shared. If you de-brand the
page in question (I'm assuming it's for your employer) and host it
somewhere you'll have a far better chance of more in-depth help.
cheers,
Andrew.
http://leftjustified.net/
**
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 columns, one fluid one fixed?
Sorry for the double post, merely a quick clarification :) There's a much better term for it in the spec, but alas I'm not in the mood for spec. trawling at the moment The proper explaination is that floated elements without an intrinsic width[1] must have one declared in CSS. For a detailed run down on how margin's padding and dimensions are/should be calculated in CSS2.1, check here: http://www.w3.org/TR/CSS21/visudet.html#Computing_widths_and_margins ..and the CSS 2 Recommendation version: http://www.w3.org/TR/REC-CSS2/visudet.html#Computing_widths_and_margins [1] Intrinsic dimensions The width and height as defined by the element itself, not imposed by the surroundings. In CSS2 it is assumed that all replaced elements -- and only replaced elements -- come with intrinsic dimensions. [ soure: http://www.w3.org/TR/REC-CSS2/conform.html#intrinsic ] hope that helped, Andrew. - http://leftjustified.net/ ** 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] Irrelevant properties
Hey mate :)
Interesting question, I think this one comes down to the dev environment...
If you're the only person who will be working on this (ie: it's a
personal project) then using what you've got and adding an informative
comment would be enough.
On the other hand, if I saw this at work I would def. insist that they
change it to something like the following:
h1, #head ul {
margin: 0;
padding: 0;
position: absolute;
width: 100px;
height: 100px;
top: 10px;
left: 10px;
background: url(some.img) no-repeat;
overflow: hidden;
}
#head ul { list-style: none; }
If there is any chance at all that you may want to add more UL
specific rules, I would split it up now.
While it is valid, applying innapproriate properties to elements is
habit worth avoiding :)
cheers,
Andrew.
On 8/17/05, Jan Brasna [EMAIL PROTECTED] wrote:
Hi all.
How much appropriate is attaching eg. list-style to a definition for eg.
heading, when I want to set it for more elements, but avoid splitting
the definition in two?
Example:
h1, #head ul {
list-style: none;
margin: 0;
padding: 0;
position: absolute;
width: 100px;
height: 100px;
top: 10px;
left: 10px;
background: url(some.img) no-repeat;
overflow: hidden;
}
Can the list-style attached also to h1 make some confusion?
Thanks, Jan.
--
Jan Brasna aka JohnyB :: www.alphanumeric.cz | www.janbrasna.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
**
--
http://leftjustified.net/
**
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] Printed web pages with text cut in half at the bottom o f the page?
That is exactly what I was thinking of. Do you know what the support is for this statement? Support for page break control via CSS is pathetic, especially if your trying to set orphan/widow rules. Spec: http://www.w3.org/TR/REC-CSS2/page.html -Andrew -- http://leftjustified.net/ ** 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] Opening external links in popup windows with no extra markup
On 8/2/05, Ben Curtis [EMAIL PROTECTED] wrote:
Good catch. Now we're talking a good excuse for regular expressions.
Instead of my recommendation of:
a[i].getAttribute('href').toUpperCase().indexOf(HTTP://) == 0
...I now recommend:
/^https?:\/\//i.test(a[i].getAttribute('href'))
Talk about technology for technology's sake! At least you admitted it
(good _excuse_ for regular expressions ;)
RegExp() is one of the top three resource hungry javascript functions
to avoid. The other two biggies being eval( ) and setInterval. ( JS
Gurus: please feel free to correct me on that one if you believe
otherwise! )
I once had a reference sheet with all the js string manipulation
methods in order of their speed; if I could find it you'd be clicking
a link about now...
I'd use this:
if ( a[i].getAttribute('href').indexOf(://) -1 ) {
//do stuff
}
Cheers,
Andrew.
http://leftjustified.net/
**
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] Regexp vs indexOf (followup on: Opening external links)
Thanks for clearing that up Ben! Always glad to be told I'm wrong if I can walk away from it having learnt something ;) Cheers, Andrew. On 8/3/05, Ben Curtis [EMAIL PROTECTED] wrote: This is outdated information, apparently. I had heard the same, and was curious if things had changed since then, so I ran tests. In Firefox, the regular expression is faster than the complete indexOf, and just as fast as your minimal indexOf check. Not so in Windows IE 5.5, and in Win IE 6 the two techniques are on par. This would indicate a common audience sees no difference or a performance improvement with regular expressions over indexOf. http://www.bivia.com/sandbox/code_performance/ string_parse_speed_test.html The difference in speed is minor enough (fractions of milliseconds) that the extra code to make the indexOf check the same factors (i.e., case insensitivity, that :// isn't occurring somewhere later in the url, after the protocol, etc.) is a factor (about 60 bytes = 0.4 milliseconds over 1Mbps broadband, or twenty times the speed of the regexp execution). But, honestly -- fractions of a millisecond. The only concerns I have for the equation are: 1- if it's unobtrusively applied, then is it bullet proof (that is, can it give a false positive a non-scriptor will have to contend with)? 2- is it easy to read, understand, and modify three years later without documentation? ** 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] Site Check: VVE
1. Maybe use search instead of query as a label for the search form. Maybe use Find instead of search or query (then again, your target audience is developers, so query is part of their vocab). 'Search' suggests that a 'hunt and peck/ hit and miss activity will follow. More important than that -- how about adding a notice in the footer Virtual Earth is a trademark of Microshlop. This site is neither endorsed nor affiliated with Microsoft. After all, they are the lawsuit type ;) Cheers, Andrew. http://leftjustified.net/ ** 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] implicit / explicit labels which is better?
Whooa nelly! !important -- not adding a 'for' attribute kills half the purpose of using a label 0_o Without a for attrib, clicking the label will not affect (focus/activate) the input element nested within. This is especially important in the case of checkboxes and radio buttons as the label provides a target that can actually be clicked by most users. I've said this to many WSG members before -- providing for physical dissablities IS EXTREMELY IMPORTANT -- they're far more common than people think. EG: I have incredibly shaky hands, yet I surf the web at home using a wacom tablet and a keyboard with my head approx 2 feet from the monitor. I can't click a radio button on the first attempt with that setup, but that's my setup and you have to account for freaks like me when designing :) My personal preference is to always use the 'belt and brace' method as I use the label as the container that lines up the label text and the input. This also means that the entire row for each element is clickable. w00t. [Hint: label text within a span can be vertically centered relative to the label using the vertical-align property ;) -Andrew http://leftjustified.net/ On 8/2/05, Chris Kennon [EMAIL PROTECTED] wrote: Hi, Thanks, the belt and brace approach being most secure? foo name=foo //label ** 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] Opening external links in popup windows with no extra markup
On 7/30/05, Thierry Koblentz [EMAIL PROTECTED] wrote: I think you ought to check specifically that 'http://' is at the beginning of the string. Good point, I'll change this. A more reusable approach would be to check for '://', as this is what differentiates 'mailto:', relative paths and 'http://' links, but will still allow you to use the script on secure pages. Whenever dealing with href maniputlation, it's always good to keep 'https' in the back of your mind ;) Other than that, it looks like a great approach for sites with client controlled content. Sure beats trying to teach them to include a different class or rel attrib on external links! Andrew. http://leftjustified.net/ ** 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] Opening external links in popup windows with no extra markup
Something similar to this came up at work last week and I think it would be good to tack it on to this thread (hopefully there's enough relevance!). The problem was that we wanted to handle links to non-html files in a different manner than regular links. Ideally, it shouldn't require any more effort from the content author. The following page shows a simple demonstration of the solution: http://leftjustified.net/lab/javascript-file-links/ By splitting it into a switch/case, you can have different behaviour/style/etc for each file type. A good example might be redirecting all mp3 links via a site's Flash audio widget if Flash (and js) are present. Another useful addition would be to check if the link is the sole child element of an li, in which case you may want a large icon to the left (see demo page) or if it's the child of a paragraph, you may want a smaller icon on the right... All without the author even considering that they are linking to a file that could potentially load external apps/plugins. In a controlled input situation (eg: a web developer's blog), a solution like Patrick Lauke's 'type' link styling expermient ( http://www.splintered.co.uk/experiments/38/ ) adds more useful info to the markup and can be used the same way; but when a client is in control of the content you set up whatever automated help you can and cross your fingers ;D Cheers, Andrew. On 7/30/05, Thierry Koblentz [EMAIL PROTECTED] wrote: A more reusable approach would be to check for '://', as this is what differentiates 'mailto:', relative paths and 'http://' links, but will still allow you to use the script on secure pages. Whenever dealing with href maniputlation, it's always good to keep 'https' in the back of your mind ;) Nice catch! Other than that, it looks like a great approach for sites with client controlled content. Thanks Andrew, 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 ** -- http://leftjustified.net/ ** 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] base css
what are you guys using as a base css file to start a site with common hacks and what not? plug http://leftjustified.net/journal/2004/10/07/css-negotiation/ /plug and plug http://leftjustified.net/journal/2004/10/19/global-ws-reset/ /plug Couldn't help myself ;) Andrew. http://leftjustified.net/ ** 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] Followup to Tuesday's Brisbane Meeting
Video is still in the works. We'll probably be looking for volunteers later on to help us caption the sucker... We've just got to wait for the AV team to have some spare time to digitise it so I can take it home and edit it into something worthy of upload (Don't worry Ben, I'll overdub you with someone interesting ;p) Once it's edited, we'll cut it up into manageable blocks and put the call out for captioners. Ben and I will fill the void left by any potential lack of volunteers. Cheers, Andrew. ** 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] Background image in li not showing in IE
Other fixes for this problem are as follows:
li { position:relative; }
li { height:1%; }
li { zoom:1.0; }
Applying borders may also fix the problem, I haven't tested that one
as it's a bad solution anyway -- changing the design to fix a bug
isn't cool at all; plus IE can't handle transparent borders anyhoo.
Other solutions can be tested by using this JS in IE:
alert(this.hasLayout);
If it comes back true, you've won :D
Now that I can confidently tackle the IE/PC bugset, I don't mind IE so
much... it keeps me in a job! heh ;)
Andrew.
---
http://leftjusitfied.net/
On 6/20/05, Cole Kuryakin - x7m [EMAIL PROTECTED] wrote:
Thanks for all the suggestions Peter. I hadn't gotten it fixed until I set
the width of the li as per your suggestion.
Now the bullets show up in IE as desired.
Cole
- Original Message -
From: Peter Ottery
To: wsg@webstandardsgroup.org
Sent: Monday, June 20, 2005 7:54 AM
Subject: Re: [WSG] Background image in li not showing in IE
Cole wrote:
I've got a small background icon that I've hooked to a few li's.
Displays as planned in FF, but doesn't display at all in IE6.
Any ideas how I can fix this in IE?
not sure if youve solved this by now but often i find if you specify a
background colour (instead of transparent), IE will play along nicely.
so instead of :
li.signInOptions {background: transparent url(../../admin/i/info.jpg) 0 5px
no-repeat}
try
li.signInOptions {background: #fff url(../../admin/i/info.jpg) 0 5px
no-repeat}
of course, then thats a pain if you have a background image that needs to
sit on varying background colours. you may end up needing to feed specific
colours to certain uses, eg...
#nav li.signInOptions {background-color:#ccc}
...if the li's needed to sit within a navigation area that has a background
of #ccc
the other thing to try when IE isnt displaying a background image is to
specify a width on the li.
hth,
pete ottery
**
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] DOM tutorials/books?
On this topic, I've recently picked up a copy or 'Javascript -- The Definitive Guide' published by O'Reilly. This book came highly recommended to me by the best scripters I know. Having read the first 220 pages over the weekend, I can honestly say that it will have a place on my desk whenever I'm working on a JS project. $US26 from Amazon. Bargain :) On 6/14/05, Nick Elliott [EMAIL PROTECTED] wrote: Hi Following up on a thread from a month back, this book is now finally out. DHTML Utopia Modern Web Design Using JavaScript DOM by Stuart Langridge http://www.sitepoint.com/books/dhtml1/ Haven't had time to read it yet, although there are four free chapters (135 pages) available for download from Sitepoint's website if anyone is interested. Author comes from Melbourne, but I don't think he's a member of the WSG! Cheers Nick Cheltenham, UK -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] Behalf Of Nick Elliott Sent: 04 May 2005 14:03 To: wsg@webstandardsgroup.org Subject: RE: [WSG] DOM tutorials/books? I've ordered this book from Amazon - it's not out yet, but looks as though it might be worth looking at. DHTML Utopia Modern Web Design Using JavaScript DOM by Stuart Langridge http://www.amazon.com/exec/obidos/tg/detail/-/0957921896/qid=1115210999/sr=8-1/ref=pd_csp_1/002-3070291-6356067?v=glances=booksn=507846 Nick -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] Behalf Of James Denholm-Price Sent: 04 May 2005 10:50 To: wsg@webstandardsgroup.org Subject: Re: [WSG] DOM tutorials/books? On 5/3/05, Zulema [EMAIL PROTECTED] wrote: Are there any good books or tutorials that I can read/follow to learn all about the DOM? If you're looking for a book my favourite is Flanagan's JavaScript: The Definitive Guide (O'Reilly) James ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** This e-mail is private and confidential and is protected by copyright. It may also be privileged or otherwise protected by other legal rules. Access by or disclosure to anyone other than the intended recipient for any reason other than the business purpose for which the message is intended, is unauthorised. If you receive it in error, notify us, delete it and do not make use of or copy it. Internet communications are not secure and therefore the Sesame Group companies (Sesame Group Limited, Sesame Limited, Sesame Services Limited, Assureweb Limited and Sesame General Insurance Services Limited) do not accept legal responsibility for the contents of this message. Any views or opinions presented are solely those of the author and do not necessarily represent those of Sesame Group companies unless otherwise specifically stated. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** This e-mail has been scanned for all viruses by Star. The service is powered by MessageLabs. For more information on a proactive anti-virus service working around the clock, around the globe, visit: http://www.star.net.uk ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** -- http://leftjustified.net/ ** 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] WSG Meetings for the rest of us
If all goes to plan (and it has so far), this tuesday's Brisbane WSG meeting will be filmed with the intention of offering it up for WSG members. If anyone wants to volunteer to do the captioning that would be awesome, otherwise some of the locals will probably draw straws for it... (don't be afraid, SMIL is easy --- just disect Patrick's captioned version of a Zeldman speach ;p) I know the film quality will be bad because I'll probably end up holding the camera; but who cares, we've got to start somewhere. Cheers, Andrew. - leftjustified.net ** 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] Definition lists for comments in blogs
Heh, well if the blockquote approach is considered overkill, you'll choke on what I actually use for my comments... ol li dl dtAndrew said:/dt ddpThis is my comment. It is the definition of 'Andrew said' within this context./p/dd /dl dl class=date dtComment posted on:/dt dd9:15 am, 28th of May 2005/dd /dl /li /ol my 2c :) Andrew. http://leftjustified.net/ ** 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] EDS embracing Web Standards
Either these guys did the design, or your old employers stole their 'standards' page directly from here: http://www.figdesign.com/site.html I love running corporate standards BS through Google -- then you can see where it really came from ;) Andrew. http://leftjustified.net/ ** 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] best way to approach markup of an address
On 5/24/05, Ben Curtis [EMAIL PROTECTED] wrote: dl class=postalAddress dtCanada/dt dd class=companyIn The Game, Inc./dd dd class=divisionCustomer Service/dd dd class=street1135 West Beaver Creek Road Box #604/dd dd class=cityRichmond Hill/dd dd class=stateON/dd dd class=postalCodeL4B 1C0/dd /dl picky type=semantics I think that one would have to qualify as improper use of a dl. The method I use to decide on the appropriate use of dl is to say 'equals' in between the dt and each dd. Now let's apply that to your use: 'Canada equals In The Game, Inc' ...no it doesn't 'Canada equals Customer Service' ...no it doesn't 'Canada equals ON' ...ummm, the other way around, perhaps. and so on. /picky Andrew. --- http://leftjustified.net/ ** 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] Question about multiple style sheets
I was wondering whether it is better to use the import command in the main style sheet and import the other style sheets that way or to have multiple link hrefs to stylesheets or whether it makes no difference how you do it. @import will stop working at 2 levels deep (an @imported stylesheet will import another, but that second @imported file won't import a thrid) -- or as is my understanding (sorry, can't find reference atm) It doesn't really make a difference. The main factor in my mind is browser negotiation. Which browsers do you want to serve your CSS to? Is the type.css file simple CSS1? If so, perhaps use the plain old link / method (with media='screen' or 'all' ONLY) so NN4 can get some nicer typographic styling... The print one is simple -- link media='print' / If you've got crazy floated column madness (who doesn't?), I'd import that one like this: style media=screen,projection type=text/css /* block IEmac 'cause it tends to bork with float layouts \*/ @import url(layout.css); /* that'll do nicely */ /style the media attribute value of 'screen,projection' will block NN4, the comment hack will block IEmac. The 'projection' value tells Opera to use this stylesheet in the rare occassion that someone views your site in Opera's full screen/projection mode. It's a bit old now, but I wrote an article about this stuff last year: http://leftjustified.net/journal/2004/10/07/css-negotiation/ hope that helps :) Andrew. p.s -- Helen, I think we were both on a Blackboard conference call together last week! (Im with Griffith uni) Small world! ;) http://leftjustified.net/ ** 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] hiding content with a click
On 5/9/05, john [EMAIL PROTECTED] wrote:
create a link that says hide content and it will remove a section
of text from the
page. The layout uses some tables (XHTML Transitional), so it would
have to hide three tr's and shift the content below it up.
Can somebody please instruct me on a standards-based way of doing this?
Quick version, will hide all tr's with a class of 'hide'. Class
attribute may be a space seperated list also, as this script allows
for that.
a href= onclick=hideStuffhide content/a
script type=text/javascript
function hideStuff() {
tr = document.getElementsByTagName('tr');
for(i=0; itr.length; i++ ) {
if( tr[i].className.indexOf('hide')) {
tr[i].display = 'none';
}
}
}
/script
hth,
Andrew.
http://leftjustified.net/
**
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] hiding content with a click
Ooops! I really shouldn't leave things half-baked like that.
If the link in question doesn't do anything without javascript, it is
a wise idea to have it written to the page using js as well.
We don't want any orphan UI elements, do we ;)
And I even tested this one :]
//let the code begin
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd;
html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en
head
titleHide Content Test/title
meta http-equiv=Content-Type content=text/html; charset=utf-8 /
script type=text/javascript
function hideStuff() {
var tr = document.getElementsByTagName('tr');
for(var i=0; itr.length; i++ ) {
if(tr[i].className == 'hide') {
tr[i].style.display = 'none';
}
}
return false;
}
function addHideLink() {
var link = document.createElement('a');
link.setAttribute('onclick', 'hideStuff()' );
link.setAttribute('href', '#');
link.appendChild(document.createTextNode('Hide Content'));
var parent = document.getElementById('hold');
parent.appendChild(link);
}
window.onload = addHideLink;
/script
/head
body
div id=hold/div
table
tbody
tr
tdfoo/tdtdbar/td
/tr
tr
tdfoo/tdtdbar/td
/tr
tr class=hide
tdThis one's gonna go/tdtd:)/td
/tr
tr
tdfoo/tdtdbar/td
/tr
tr class=hide
td..and/tdtdthis one/td
/tr
/tbody
/table
/body
/html
This is a pretty rough example with poorly written scripts (ie: the
class names, id's and function to be attached to the created element
should be passed as var's), but it works and it gives you something
you can improve on.
Cheers,
Andrew.
http://leftjustified.net/
**
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] CSS3.0
David R wrote: Suppose you have a div element and give it 5 background images and a background color: [...] ...Wouldn't the background colour of the element show through the transparency of the image, thus rendering any round-corner images using transparency useless? Yes, that is my understanding also. I think border-radius would be off assistance here, provided the edge of the png is a curve... Sounds like a bit of a gap in the spec, perhaps you should chase them up about it? :) Andrew, ** 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] CSS3.0
Too late, it's already in there: http://www.w3.org/TR/2005/WD-css3-background-20050216/#the-background-image Most of the modules are at working draft stage, see the lot here: http://www.w3.org/Style/CSS/current-work Andrew. http://leftjustified.net/ On Wed, 16 Feb 2005 23:31:20 +, David R [EMAIL PROTECTED] wrote: Just out of curiosity... Is the CSS3.0 Spec finalised, or are they still accepting suggestions and comments? Because I really want to suggest multiple background images for CSS3.0 (provided it isn't suggested already) Where do I find the Suggestion Box for the W3C? ;) Regards -- -David R ** 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] IE7 Confirmed
On Tue, 15 Feb 2005 20:21:58 -, Kornel Lesinski [EMAIL PROTECTED] wrote: No... he used word compatibility, which means that all bugs must remain untouched. Here's a quote from the press release: Internet Explorer 7.0, designed to add new levels of security to Windows XP SP2 while maintaining the level of extensibility and compatibility that customers have come to expect. Sounds like the bugs are staying -- maintain compatibility is synonomous with leave the bugs alone in MS terms :( Andrew. http://leftjustified.net/ ** 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] Unclickable text field inside float in IE?
Buh? Try position:relative; Wild guess, but always worth a try On Wed, 16 Feb 2005 10:02:28 +1000, Josh McDonald [EMAIL PROTECTED] wrote: Hey, I've managed to somehow get an unclickable text field in explorer. It's in a float:right div, and unfloating the div fixes the problem, but I've had text fields in floats before without problems. For some reason only the top border of the text field can be clicked on :( Any suggestions as to what I should be looking for? -- So come and join us all you kids for lots of fun and laughter While Roger Ramjet and his men get all the crooks they're after [ Josh 'G-Funk' McDonald ] -- [ Pirion Systems, Brisbane] [ 07 3257 0490 ] -- [ 0437 221 380 ] -- [ http://www.gfunk007.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 ** -- http://leftjustified.net/ ** 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 INSANITY ... please help me
note to all: IF IN DOUBT, add position:relative; -- it fixes many,
many IE bugs :)
Would it be excessive or treacherous to declare for Win IE:
* html * { position:relative; }
Yes, I think so. One instance I can think of is that links within a
scrolling div will not scroll (in IE) if they are assigned
position:relative; This is a major problem as the links sit still
while the rest of the content scrolls underneath them.
There are times when position:relative; is the best IE fix, but there
are other times when it does nothing. In those instances, try
height:1%; (the Holly Hack), as this has the same affect as
position:relative (it sets 'hasLayout' to 'true'), but seems to be a
bit more potent.
Andrew,
http://leftjustified.net/
**
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 standards training course/events in Sydney?
Web Essentials will definitely be on again. Russ, Peter Maxine and I are working hard to put together an even better event this year. Best. News. Ever (well, not quite, but close ;) Excuse me while I dance around the office like a complete idiot.. Can't wait to see the line-up, Andrew. http://leftjustified.net/ ** 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 INSANITY ... please help me
On Thu, 10 Feb 2005 22:31:48 -0600, Mani Sheriar [EMAIL PROTECTED] wrote: The H1 for the first article (at the top left) does not display in IE. It does not show up at all, even though the code is exactly the same as it is for the following two articles. What shows up is just blank white space. Under your #mainCol h1 rule, add position:relative; and change the background property to this: background: #d4bf34 url(../img/article.gif) no-repeat left center; Tested -- known to work :) The icon (small arrow) for the H2 (showing the author's name) shows up when the page first loads, but not after one has scrolled down and then back up. After that it disappears. Another case of hasLayout = false -- add height:1%; OR position:relative; both will fix the problem. What is going on here? Can anyone help me before I need to be put in a padded room? These bugs are both caused by IE's hasLayout property. hasLayout owes me 200 hours and a large piece of my sanity. Welcome to the club ;) note to all: IF IN DOUBT, add position:relative; -- it fixes many, many IE bugs :) Andrew. http://leftjustified.net/ ** 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] Follow up from Brisbane meeting
Well, that was interesting... It would seem after spending most of the time discussing how to get around IE's bugs, IE got its revenge by failing to load an integral part of the design. To those who attended: the problem is solved now, I've removed the old min-max script and put in Dean Edward's IE7. This is a stop gap measure until I can further investigate this afternoon. Locally, it works perfectly. Online however, the min-max script doesn't load. Bah humbug! :) Here is the url to the slideshow: http://leftjustified.net/site-in-an-hour/ ...and the demo site: http://leftjustified.net/site-in-an-hour/site/ The CSS file and form.js are heavily commented, but feel free to ask questions. Now that I'm not standing in front of everyone I may be able to answer without getting thrown off by nerves! Lea will most probably expand on this in a more formal sense, but I'd like to take this opportunity to thank Gary Menzel for providing us with such a fantastic venue for the last 8-10 months. Thanks Gary! :D I know a few people are waiting on other urls that were mentioned during the night -- it was a late night and a VERY early morning for me, so please refresh my memory if there's anything in particular you'd like clarification on. Cheers, Andrew. http://leftjustified.net/ ** 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] Follow up from Brisbane meeting
On Thu, 10 Feb 2005 09:35:14 +1000, Josh McDonald [EMAIL PROTECTED] wrote: Secondly - I consider myself fairly well versed in the voodoo that is javascript, but what in the flamin hell is that IE7 script? I got halfway down the thing adding spacing and indentation in the hope it would become readable, but all I got is... WTF?. Why all this horrible, horrible chicanery when a couple of IE css expressions should do the trick? As I stated in the first post, throwing in IE7 is a stop-gap measure for today so I could share the URL. The IE7 script actually enables IE to accomplish a plethora of css-realted tasks that better browsers take for granted. You're absolutely right in saying that some expressions would do the trick, that may be the solution I run with, but I've still got an 8 hour day to get through before I can take another look :( For the record, the original script I (attempted) to use last night works fine on my Win2k system at work, which is where I tested it yesterday afternoon. It also works locally on my XPsp2 system at home, but doesn't run (or throw an error) when viewing the online version on an XPsp2 system... Why all the horrible chicanery? 5 hours sleep in 3 days can make a man do strange things to get the job done. ;) I'll post to my blog by the end of the week explaining what went wrong. In the meantime -- Andrew.doofus ++; Hang on, actionscript isn't a standard! More info on IE7: http://dean.edwards.name/IE7/ Cheers, Andrew. http://leftjustified.net/ ** 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] Browser Checks
On Tue, 8 Feb 2005 07:06:21 +0100, Andy [EMAIL PROTECTED] wrote: If your code is compliant then just about every browser out there will be able to generate it with a 90% accuracy regarding design and 100% accuracy regarding content. What kind of make believe web do you design for? Every day I deal with horribly incorrect (according to spec) rendering across all but the latest of browsers -- and before you respond, I can assure you the code in question is clean as driven snow (well, valid at least :p). Unless your '90% of browsers' refers to the browsers used by 90% of your traffic and not 90% of the browsers available (of which there are over 30 semi-common ones, to my knowledge) then I think you may just be opening a can of worms purely for the sake of it. Andrew. ** 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] Browser Checks
OOPS! I just swore on list SORRY :) http://leftjustified.net/ ** 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] Browser Checks
Well I suggest you name names and show examples of compliant html 4.01 that doesn't show 100% of the intented content and doesn't at least resemble like what you intented. Compliant html pages styled completely with CSS displaying bugs? Easy, I would make some examples for you now if I wasn't already doing an all-nighter. Table based design with bugs? A little harder to find. Remember that the most important part of your webpages are to provide content. If your content is worth it, people will return regardless of little design issues. I couldn't agree more, though display bugs can and will turn visitors away. A simple example is a multi-column layout whereby the columns are rendered with a miniscule width -- a common problem with IE mac and complex float layouts (even with all floats having declared widths, as per spec) Possibly but those 30 semi common ones are almost always based on a common engine (like Geko, Mozilla, etc) and their quircks mode will horribly deform your pages thats why it's so important to set doctype and use coding that forces them to stick to standards compliant mode and not their quircks mode. Don't bring quircks mode into this, I'm talking solely about 'standards mode' -- there are still bugs in ALL browsers. If you haven't found them, push a little harder, you will :) Your reference to worms is misplaced. Obiviously your opinion differs from mine but that is no reason for insults or insinuations. My reference to a 'can of worms' is entirely related to your initial post -- echo opened $what; I had no intention of insulting you, merely disagreeing in a loud fashion. Andrew. Registered shit-stirrer No. 30077. ;) http://leftjustified.net/ ** 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] Not and IE bug?!?
You need to clear your floats. Check this: http://www.positioniseverything.net/easyclearing.html (technique discovered by WSG member Tony Aslett ;) Andrew. -- http://leftjustified.net/ ** 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] different hover for visited links than unvisited?
a:visited:hover {
...styles...
}
OR
a:visited::hover { ... }
(double colon is CSS3 syntax)
Untested, but theoretically it should work...
Andrew.
http://leftjustified.net/
On Tue, 08 Feb 2005 18:40:34 -0800, Andreas Boehmer
[EMAIL PROTECTED] wrote:
I was wondering whether there is any way of creating a different hover
effect for visited links than unvisited links, but I have got the
feeling there is no way to achieve this?
I was first hoping it could be done by changing the standard order of
the pseudo classes, but that's not the way to go.
Has anybody found a way of getting this to work?
Thanks!
Andreas Boehmer
User Experience Consultant
**
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] Another plea for help: FF1.0 render problem
Your problem occurs when you have the border-top: 0; after the border
statement.
Is this a Gecko bug, I wonder?
I doubt it, more likely that border-top:0; is incorrect use of the
shorthand property.
'border-top' is supposed to receive 3 values, border-top-width is what
you would use to set the height to 0.
While it doesn't state either way in the W3C docs, it is my belief
that using '0' for a shorthand property which expects strings (eg: 3px
solid gray; as opposed to :1.5em 2em 1em 4em; for padding, margin or
border-width) is a practice worthy of stearing clear.
border:none; does the same thing, but in a string format.
Much like you could use 'none' as the sole value of the list-style
shorthand property.
Personal preference, but you wouldn't have lost any sleep if you had
used 'none' in the first place ;)
You should also note that using a shorthand declaration without
declaring all values will reset the undeclared values to their
defaults. Here's an example from the CSS2 Rec.:
BLOCKQUOTE {
border-color: red;
border-left: double;
color: black
}
In the above example, the color of the left border is black, while
the other borders are red. This is due to 'border-left' setting the
width, style, and color. Since the color value is not given by the
'border-left' property, it will be taken from the 'color' property.
The fact that the 'color' property is set after the 'border-left'
property is not relevant.
That's another thing you wouldn't have to worry about if you used
border:none; instead of border:0;
hth,
Andrew.
http://leftjustified.net/
**
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] Nothing too flashy
While you could just nest the iframe in the object as fallback (is that valid nesting? Unsure about iframes..), fallback content often doesn't work due to users having the flash plugin but having flash content blocked by a browser plugin. Another way to do it would be to use a flash detection script like this one: http://www.skyzyx.com/scripts/flash.php I haven't looked through it, but Ryan writes good code so I imagine it's detection method would include physically adding a flash object to the DOM and then checking it exists -- it wouldn't exist if a browser plugin was blocking flash. So here's how you would use that: - iframe is in source. - If flash is detected, grab the iframe using JS and replace it with the flash object. Simple, eh? :) hth, Andrew. http://leftjustified.net/ ** 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 app guidance/site comment
Your :hover changes on menus create a contrast shift that is far too small. In short, make the :hover background lighter and text darker so we can still read the menu :) On Fri, 4 Feb 2005 19:21:31 +1100, Brendan Smith [EMAIL PROTECTED] wrote: Greetings all, I'm currently working on a web app that I have created in as much of a web standards karma giving way as I can muster. If I could get some feed back on this little number from the crowd out there I would be most greatful. General tips and pointers are what I'm after. If you look closely enough it might be blatantly obvious who this project is for. Ok, if you're from Sydney Australia and drive a car/have a license that is. https://monitor.hpa.com.au/rta/ https://monitor.hpa.com.au/rta/ This is in no way a live product, and for the most part are just a bunch of static HTML files. Expect no magic within! Or live database for that matter. I have managed to keep the majority of pages valid in both HTML and CSS. (When I typed that I felt I should get a badge or something?) The only quirk I have with it is how some tables will wrap/drop below the menu on IE in tight areas (narrow your browser on the home page). Is this to be expected? Thanks in advance for your time... Brendan -- http://leftjustified.net/ ** 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] Now you see it, now you don't
Try this:
ul.sm_menu li {
position:relative;
}
I had the same problem on greatpikespeakbirdingtrail.org, and that was the fix.
The dissapearing BG bug is another one from the 'hasLayout' family. I
HATE hasLayout, it is IE's worst feature
Andrew.
http://leftjustified.net/
On Wed, 02 Feb 2005 21:55:36 -0600, Charles Martin
[EMAIL PROTECTED] wrote:
Okay, this one issue is blowing my mind right now. Naturally, viewed in
Firefox, it looks fine. However, when you view this in IE6, just move
the mouse over the VISIT header in the menu bar on the left. The
green background disappears and doesn't come back. I'm at a loss here.
http://www.yahsaves.org/index.php
http://www.yahsaves.org/yhwh.css
Appreciate any help. I'm gonna work on other content for now.
_
Charles Martin
http://www.webcudgel.com
[EMAIL PROTECTED]
**
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
**
[WSG] Brisbane Meeting CHANGE OF PLAN
Hi group :) The proposed presentation for the February meeting is some of the technical aspects of CSS a title invented by the good people at WSG to account for my slackness ;) The presentation I will be giving is Site in an Hour Studying the workflow of CSS development. I will be presenting the creation of a simple, yet highly usable/accessible interface using CSS, XHTML and a dash of smoke and mirrors via the DOM. We will start at the layout stage planning how to chop up an existing layout (photoshop) and create it in CSS using the minimal amount of (hopefully) semantic mark-up. We will take it all the way to completion (time permitting). Each decision along the way will be discussed amongst the group and proposals for other methods of solving the same problems will be noted; from which two layouts will be presented to the web as a whole my original version and the collaborative version created on the night. Both will be accompanied by a run down on the key decisions and compromises and the thought processes behind those. I'm hoping to chair a group discussion, rather than do the whole 'one way presentation' deal. I don't want to stand up and say 'this is how I do [whatever], therefore you should do the same'; I want to get shouted down by determined CSS freaks and semantics trolls. In other words bring it on! Then we all learn something new! ;D Hope to see you there :) Andrew. P.S The now obligatory S5 presentation will go online the afternoon following the presentation. P.P.S -- We're hitting the Pig n' Whistle afterwards - piking out is not an option ;) http://leftjustified.net/ ** 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] Emulating min-width
For min/max width/height in IE5+, I use this: http://www.doxdesk.com/software/js/minmax.html It's simple, it works, what more could you ask for? Andrew. http://leftjustified.net/ ** 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] CSS / JavaScript Problem
Simply remove the !important. If both selectors have the same
specifity, the last one in the source order (or last to be imported)
will (*should*) take precedence.
On Sat, 29 Jan 2005 08:33:03 +0200, Jacobus van Niekerk
[EMAIL PROTECTED] wrote:
Anybody have a solution for the following:
I have a default style for a element:
#s1 {height: 215px;}
In some of the pages I need to update this value to auto, and I use
!important setting to enforce this, via a updates.css file:
#s1 {height: auto !important;}
Now here is the problem:
I now have to look at 2 elements, via JavaScript, in the doc, check which
has the highest high value and assign that value to both elements. No matter
what value I assign to both elements, the previous !important setting
overrides the new values.
Is there any way I can override the !important setting via JavaScript?
I need a solution quite urgent, and will keep digging into this myself, but
if anybody knows how, I would really appreciate this.
Thanks in advance!
Kind Regards
Jacobus van Niekerk
Creative Consultant
web: http://www.catics.com/ | http://www.freelancecontractors.com
tel: + 27 21 982 7805
--
No virus found in this outgoing message.
Checked by AVG Anti-Virus.
Version: 7.0.300 / Virus Database: 265.7.4 - Release Date: 2005/01/25
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
--
http://leftjustified.net/
**
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] Search Engines and CSS
I remember reading a quote from a Google tech. stating that while their system is capable of reading/interpreting CSS, they don't do so due to the excess load it would create. I also remember the same quote mentioning something about sites only getting penalised if someone lodges a complaint against them (re: CSS hiding of h1's etc). Unfortunately I have no idea _where_ I read this, so I guess you'll have to throw it on the pile of 'hearsay' Andrew. http://leftjustified.net/ ** 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] Sound without Plug-in/HTML Sound?
object src=http://www.yourdomain.tld/audio/your.snd; type=MIME/GoesHere / ...Thats only from the top of my head, you'll have to check to see if it works, of course, but that should work in browsers that interpret the object tag appropriatley Browsers that interpret the object tag correctly... You mean both of them? lol. I''ve played this game before, you won't get very broad support using the object method. I usually use Flash to insert sound, as it a) has more reliable support across different UA/OS combo's b) offers more control to you and the user. (ie: big 'STOP' button for those of use who hate web audio ;) HTH, Andrew. - http://leftjustified.net/ ** 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] .php extension
On Thu, 20 Jan 2005 13:51:35 -0330, Paul [EMAIL PROTECTED] wrote: I have a template that I have created and am creating all my pages from that. I have named this file x.html but when I try and rename it to x.php, because I have some dynamic content on it, nothing displays. Any ideas why this happens ? Well, everyone seems tobe giving very complicated answers, though I think your problem may be more simple... By 'nothing displays', do you mean the page renders blank? Are you serving an xml prologue (?xml.) ? If you answered yes to both of those, your problem is that you have 'short tags' enabled on your server. The first two characters of the xml prologue are telling PHP that the rest of the page is PHP code that it should parse... Everything goes pear-shaped from there. Add this line to .htaccess to disable short tags. php_flag short_open_tag off HTH, Andrew. http://leftjustified.net/ ** 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 CSS Question
On Thu, 13 Jan 2005 19:47:53 -0200, Bruno Torres [EMAIL PROTECTED] wrote: But you can hide the css from it also using link, providing two media types separated bya a comma and a space: link rel=stylesheet type=text/css href=style.css media=screen, projection / Sorry for being anal, but multiple media attrib values are to be seperated by a comma _only_, adding a space after the comma is invalid. (That said, most of my pages have a space...Glass house; stone throwing...yeah ;) Andrew. http://leftjustified.net/ ** 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] background-image:
On Wed, 19 Jan 2005 02:08:53 +0100, JohnyB [EMAIL PROTECTED] wrote:
a span { display: block; text-indent: -999em; }
is this safe? (won't it bring some scrollbars somehow etc.?)
I've never gotten that technique to work properly in Opera. It always either
a) makes scrollbars
b) displays some of the text despite insane negative text-indent values...
I recently tried something like
.hide {
display: block;
width: 0;
height: 0;
overflow: hidden;
margin: 0;
padding: 0;
font-size: 0px;
position: absolute;
}
and not also 100% sure about it...
Add top:-1000px; left:-1000px; and you'll be bullet proof ;)
Andrew.
http://leftjustified.net/
**
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] A question of semantics
On Sat, 15 Jan 2005 23:12:57 +, Patrick H. Lauke
[EMAIL PROTECTED] wrote:
The most correct way (tm):
form action=... method=...
fieldset
legendSearch Club Listings/legend
label for=nameName of club/label
input type=text name=name id=name /
label for=stateState/label
select name=state id=state
option value=../option
/select
input type=submit value=List /
/fieldset
/form
What about br /s to seperate the form elements when CSS isn't
present? View that form in anything other than a CSS capable browser
and usibility goes right out the window...
That way you can still use display:block; for any elements you want
seperate, and form br {display:none;} to hide the breaks when they
aren't needed.
Andrew.
http://leftjustified.net/
**
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] Brisbane meeting - preferred topic?
Hi all :) I'm going to be the speaker for the Feb 9th WSG meeting in Brisbane and I am undecided between two possible topics. Take a look at the two options and let me know your preference. You can let me know off list if you prefer. option 1. Safely Hacking CSS Making sites that work now and won't fall apart in the future. Covering topics mentioned in the following articles: http://leftjustified.net/journal/2004/10/07/css-negotiation/ http://leftjustified.net/journal/2004/10/19/global-ws-reset/ ...plus a little bit more ;) option 2. The interconected-ness of all things IE/pc Discovering the common thread between the most common and painful IE/pc bugs and how to diagnose and solve them without the usual head scratching. Both presentations would be of a beginner to intermediate level, I would just like to hear which is preferred by the members of WSG. P.S -- don't worry if you're not from Brissy, you can still voice your preference as the resources will go online aswell :) Thanks for your feedback, Andrew. http://leftjustified.net/ ** 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] Zero margin - just sharing
Don't think this has been mentioned anywhere yet, but one issue I
found with
this, was that within dropdowns the downarrow GUI, covers some of
the text
on the right. Here is the fix for that:
option {
padding-right:1em;
}
Indeed, that is an issue, but to my understanding it only affects
Gecko browsers. Brian Drum bought up a solution in the original post:
option {min-width:1.5em}
Different approach, same result :)
Andrew.
--
http://leftjustified.net/
**
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] list spacing
On Tue, 11 Jan 2005 10:03:58 +, Andy Budd [EMAIL PROTECTED] wrote: IE5 has a bug that can put extra space between list items. Setting the li to be inline fixes this issue. Setting height:1%; also fixes that bug. Zoom:1.0; fixes the bug in IE 5.5 and 6, but not 5.0 (plus it's invalid CSS...EVIL!). hasLayout = true in javascript also fixes the bug. Andrew. http://leftjustified.net/ ** 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] W3C Semantics Checker
http://www.w3.org/2003/12/semantic-extractor.html Great tool Absolutely, but with a major flaw (imho) It completely ignores tables, period. If I point it at my homepage (leftjustified.net), it gives a good outline of the page but makes no mention of the well structured, correctly labelled data table. So if this thing is extracting semantic data, why would it ignore a semantically correct data table... Bah humbug! (sorry, still trying to lose the christmas spirit ;) Andrew. --- http://leftjustified.net/ ** 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 ordered and unordered lists
I am trying to have an unordered list that is styled nicely with an arrow
graphic, however now I get the arrow graphic in my ordered list as well.
Descendant selectors are your friend...
.mainleft ul li {
padding: 0px 0px 0px 25px;
background: url(images/bullet.gif) no-repeat 6px top;
margin-right: 0px;
margin-bottom: 3px;
margin-left: 0px;
}
Sorted ;)
Andrew.
-
http://leftjustified.net/
**
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 ordered and unordered lists
Whoops, should have read your code a bit more before hitting 'send'
Making the following change will give you better support in IE and
Opera while also keeping the arrow centered regardless of font-size -
.mainleft ul li {
padding: 0px 0px 0px 25px;
background:transparent url(images/bullet.gif) no-repeat 6px 50%;
margin-right: 0px;
margin-bottom: 3px;
margin-left: 0px;
}
Andrew.
-
http://leftjustified.net/
--
http://leftjustified.net/
**
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] Connditional Comment / @import Problem in IE 5.0.1
Hmmm
This may sound insane, but if the style element is adding whitespace, try
style {
display:none;
}
in the IE 5.0 styles.
If that stops the style element from working (?), try height:1px;
I've never heard of this before, but my suggestion could be worth a try...
I'm guessing you're using the @import method to hide styles from NN4?
If so, this will also work:
link rel=stylesheet type=text/css media=screen,projection /
While it's totally valid, NN4 can't handle multiple media values and
ignores the CSS.
I noticed you also use quotes in the @import command to hide from
IEmac. If you put an @import rule inside a CSS file which is
link'ed, you will avoid your IE5 space problem and still hide the
CSS from IEmac and NN4.
Hope that helps :)
Andrew.
http://leftjustified.net/
On Fri, 07 Jan 2005 15:48:22 -0500, Michael Wilson [EMAIL PROTECTED] wrote:
Hi all,
I sent this earlier, but I think I accidentally hijacked another post...
For quite a while, I've been using my spare time to improve the
standards, CSS, usability, and accessibility of one of my projects. In
doing so I've also been trying to move away from IE hacks in my CSS in
favor of conditional comments, which for the most part has been a fairly
seamless process.
While making some adjustments to the main template (01) this morning, I
noticed IE 5.0.1 would behaving oddly when I added a particular
conditional comment. When I included the conditional comment, a rather
large gap would appear at the top of the page. At first, I thought
something in the IE stylesheet was causing the problem, but after
further testing I realized that it was the comment itself that caused
the issue, or rather, the comments position in the markup.
If I place the comment above the @import (02) of my main stylesheet,
everything seems to work fine; however, there is a single selector in
the IE specific stylesheet that needs to override a selector in the main
stylesheet, so the conditional comment *has* to come after the @import.
When I move the comment below the @import, IE 5.0.1 (not 5.5 or 6.0)
breaks (03).
I can completely remove the CSS from the IE specific stylesheet--saving
it as a blank document-- and the problem persists. Furthermore, and this
just makes things weirder, if I use a link href=.../, rather than
@import, the problem vanishes. I also tested several other import
methods, all of which, produce the same results as the method I
originally used.
I am using the hacked, standalone versions of IE 5.0.1 and 5.5 for
testing; however, I am aware of the issues with using conditional
comments. This particular conditional uses [if IE], so the version of IE
*should be* irrelevant. I only mention this to be sure all my conditions
are straight, in case there is any question.
Has anyone ever experienced something similar to this issue or know of
any documentation that might help explain it? Of course, I could just be
doing something stupid or overlooking something simple. I'll leave the
comment in the broken position for now, so y'all can check it out if
you like.
01: http://www.iqmax.com/iqmaxcss/
02: http://www.iqmax.com/downloads/mike/beforeimport.gif
03: http://www.iqmax.com/downloads/mike/afterimport.gif
@import method used:
style type=text/css
!--
@import url(css/iqmax.css);
--
/style
Conditional comment used:
!--[if IE]
link rel=stylesheet type=text/css href=css/iqmax.ie.css /
![endif]--
--
Best regards,
Michael Wilson
**
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] Font suggestions
Tricia Fitzgerald wrote: Does anyone know of a whimsical font that works in all browsers? I've tried Kidprint but that does not work on any of the Mac browsers nor AOL on the pc. font-family: fantasy; --- guaranteed to be 'whimsical' on any browser... ...and also very nasty (think 'Comic Sans', 'Curlz MT' et all) ** 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] Slightly OT... Interview with IE Dev team
On Thu, 6 Jan 2005 16:07:32 +1000, Barry Beattie [EMAIL PROTECTED] wrote: didn't I read somewhere that the next IE browser will be with the next OS (longhorn) in 2006? anyone confirm that? cheers barry.b G'day Barry ;D That's the official word; though your 2006 delivery date is a bit optimistic, don't you think? Other 'offical words' include that the next IE will ONLY be for Longhorn and will be integrated with the OS on a larger scale, not a lesser scale. Whether or not you buy that last line is your own choice. My greatest concern is regarding the prioritisation of CSS bugs. Basically, if they fix the * html selector bug but not ALL their insane rendering issues (99% caused by 'hasLayout'), my early work will fall to bits. For those still using selector bugs to fix other bugs...REPENT NOW! Conditional comments filtered via version number are about the only way to ensure things won't turn sour with the release of IE7. Actually, here's a question -- Will IE7's rendering engine (if it's a ground-on-up rebuild) contain the rediculous, proprietry, makes-me-wanna-hurt-things 'hasLayout'** property? I'd be very interested to hear what their plans are in that sense. **hasLayout is the mystical beast responsible for the majority of IE bugs. If something can be fixed by adding the Holly hack, position:relative; or similar, it's a 'hasLayout' bug. These include missing backgrounds, dodgy floats and loats of other nasties. If you want to get in touch with IE team members without jumping through hoops, reference the IEBlog on a weblog and Trackback -- it worked for me :) Andrew. http://leftjustified.net/ ** 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] Intro and first question
Aaah, the accessibility validators chestnut... I'm surprised Patrick and Derek and haven't dropped in on this thread yet ;) Unfortunately machines can't check for accessiblity. Really, they can't. Until they do checks like rendering pages and making sure link targets aren't incredibly small, (eg: I have shaky hands, plus I use a wacom tablet instead of a mouse...I've got no chance of clicking a 16x16 icon first try...); they'll never be more than a code validator. There are many other examples of where AX validators fall short -- have a search through accessifyforums.com and you'll find pages of opinions and alternatives. Gez's Colour Contrast Analyser is a great tool to add to the collection: http://www.juicystudio.com/services/colourcontrast.asp Andrew. -- http://leftjustified.net/ ** 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] molly gets a redux makeover
I dig all the changes so far :D Good work Patrick, and congrats on getting an 'A-list blogger' as a client! Andrew. http://leftjustified.net/ ** 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] Please explain use of html#____
' ' is CSS for 'child of'. In this instance - html#wrap - it means any element with an id of 'wrap' that is a child of the html element. The reason they've used it here is probably because IE does not understand that selector, so it will ignore the rule. Hope that cleared it up a bit for you :) Andrew. http://leftjustified.net/ ** 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] Please explain use of html#____
' ' is CSS for 'child of'. In this instance - html#wrap - it means any element with an id of 'wrap' that is a child of the html element. The reason they've used it here is probably because IE does not understand that selector, so it will ignore the rule. Hope that cleared it up a bit for you :) Andrew. http://leftjustified.net/ ** 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] expand divs height with content
Try and float just #contentLeft or #contentRight, but not both. There's nothing wrong with floating all your columns. In fact, I always float both columns as I find it more reliable than using margins/padding to clear adjacent cols. This article will solve your problem. Apply the hack to your main container http://www.positioniseverything.net/easyclearing.html Andrew. http://leftjustified.net/ ** 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] Another amazing css zen garden entry
OT: Does anyone else think the Garden needs some sort of rating system or better categorisation? When there was only ~30 it was fine. But now there's ~520. A lot will never get seen, and that probably includes some really good examples that should be. [also OT] What the garden really needs is to have each entry identified in the title tag or similar. Unless the artist has included the title in one of the images, you can't easily tell what you're looking at. This has bugged me since Dave started this project -- now it's getting way out of hand. ( I can't even find my favourite entry anymore!) Andrew. http://leftjustified.net/ ** 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 :first-line Pseudo-element
You say you want the first line smaller than the second, but your css
will do exactly the opposite (once the selectors are fixed):
.pmi {
font-size: 1.5em;
}
.pmi p:first-line {
font-size: 1.2em;
}
Let me explain; if your default font size is 10px (it's not, but this
is just an eg.), p.pmi's text will be 15px. Now, p.pmi:first-line is
1.2em -- that's 1.2 times it's default font size. Since
.pmi:first-line is a child of .pmi, it's inherited font size is 15px,
not 10. So the first line will actually have have a font size of 18px.
Not exactly what you were asking, but it's good to know how these things work :)
Andrew.
--
http://leftjustified.net/
**
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] Another amazing css zen garden entry
I know I'm way out on a limb with this one, but the ocean thing really doesn't do anything for me... The diver/flashlight effect is cool (even though it looks a bit nasty as it goes over the gradient) and the rendered ocean floor has really nice lighting, but besides that... Comments like I'm not worthy are somewhat surprising; but hey, to each their own :) Andrew. --- http://leftjustified.net/ ** 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] Another amazing css zen garden entry
It is that sense of seeing art at the cutting-edge of science that makes us go wow. Good point John, I can't argue with that :) The backgrounds are great, the css is cutting edge. That doesn't make it a great design though. Could the people who think it is so non-wow, please explain to us in a few simple words, how it is done? Then I am going to do something similar by afternoon-tea time I haven't looked at the css, but if I was trying to achieve this it would be setup something like: diver : top layer (z-index), fixed positioning, 24-bit png. gradient: second layer, attached to top, 24-bit png. light: bottom layer, fixed positioning, 24-bit png. Everything else would be animated gifs on :hover states, two reasons the effect doesn't work in IE. The ocen floor is either a photo or render, treasure chest added after the fact. Crab is animated gif, drawn over the sand but cut back to binary transparency. That said, the conception of such a technique is usually more work than the application, and this technique is pretty damn slick. What I should have said is that while the 'diver trick' is cool, I don't rate it amongst my favourite zen entries. Andrew. ** 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: Focus highlighting, was Re: [WSG] Some links for light reading (30/11/04)
On Tuesday, November 30, 2004 10:19 AM, Patrick Lauke wrote:
And you can group the above and save yourself repetition. In one
of my stylesheets, for instance, I have
#navbar li a:focus,
#navbar li a:hover,
#navbar a:active {
background: #fbfbfb;
}
I seem to recall Tommy talking about a problem when all three are specified
in the same rule, but I can't recall right now.
The problem with declaring all three in one is that IE 5 (possibly 5.5
also, can't remember which right now) for PC chokes on any declaration
that contains :focus. Combining your :active and :focus rules will
effectively cancel that entire declaration in dodgy old IE. I seem to
remember Opera in smallscreen mode choking on that combined rule as
well, but I think that's a seperate discussion. :)
Andrew.
http://leftjustified.net/
**
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: Focus highlighting, was Re: [WSG] Some links for light reading (30/11/04)
Hmm...it doesn't seem to affect IE 5 or 5.5 (admittedly using skyx' multiple IE installations on a Win2k machine natively running 6) on www.salford.ac.uk though. Maybe just depends on a variety of factors, not sure... Hmmm indeed ;) When I get home from work I'll find the exact bug and link up a test page. There is a bug in there somewhere, I remember losing sleep over it in July...well, almost. Andrew. http://leftjustified.net/ ** 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] Ten questions for John Allsopp
ot John's interview proved what Doug Bowman stated in an earlier blog post - You can't speak to an Australian without them bringing up a Simpsons quote Now that I know where the name came from, my stomach will turn every time I visit your site :) Andrew. http://leftjustified.net/ ** 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] Site check - http://www.conversantstudios.com.au/writing/
I like it :) Easy to read, I found items of interest quickly, all good from that side. Two small problems though -- the ultra wide search input looks bad as it overhangs the sidebar at anything more than 75% text-size (Moz1.7) Also, the bottom radii of the sidebar are messy -- the curves have jagged points in them which should be cleaned up. later :) Andrew -- http://leftjustified.net/ On Mon, 8 Nov 2004 11:54:38 +1100, Conversant Studios [EMAIL PROTECTED] wrote: Hey there crew, I hope you all had a good weekend! I've finally entered the wild world of blogging and I'd love to get the feedback from the WSG crew on any layout bugs etc. http://www.conversantstudios.com.au/writing/ I've done a browsercam.com check - but I'm sure there's things I'm missing. Let me know what you think, Benvolio ** 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] westciv templates competition results
Thanks for the free copy of Style Master! :D I've never been a fan of web design IDEs, but I'm sure going to give this one a good run for its money. Thanks again, Andrew. -- http://leftjustified.net/ ** 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] Margin Madness
Another is to add a 1px border of the same colour as the container - depends on your need. Or even border:1px solid transparent; Andrew http://leftjustified.net/ ** 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] 256 colours or the whole enchilada?
Out of curiosity: what's your stand to the 216 web colours? Do you stick with them or do you go the full 16 bits? Honest answer - WHAT? your monitor only supports 216 colours??! Hahahaaa... 16.7 million too much to handle? ;) Half decent answer - It's a bit like making sure all is well at 800x600; only far less important (imo). Dodgy old systems will 'round off' to colours they can handle anyway, so it's not like you're locking them out. It's wise to back your colour depth way off just to check that the rounding off of colour values isn't causing any illegibility through lack of contrast. Of course, that's not a problem because we all make sure our designs have enough contrast for low vision users - don't we? just my 2c. Andrew. -- http://leftjustified.net/ ** 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] Zeroing default padding/margin
Nothing new for list members, but I've added another post to discuss some of the issues that this thread has bought to my attention. http://leftjustified.net/journal/2004/10/19/global-ws-reset/ Andrew. ** 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] Zeroing default padding/margin
Hi all, I guess I should add my 2 cents as well :) re: Russ' comments -- 1. Once you have removed all margin and padding, this method relies on you specifically styling the margins and padding of each HTML element that you intend to use. On smaller sites where you may only need to style specific containers and elements this method is very verbose and wasteful. Perhaps listing troublesome elements instead of the wildcard selector would be a more favourable option for some, I prefer the clean slate approach. RE: Verbosity; probably, but not necessarily. I've most recently used this technique with a 5 page brochure-ware site to accompany my band's upcoming ep and I honestly don't think it added a noticable amount of weight. The benefits were immedietly noticable -- this site's design (url not avail. yet) took a 3 lazy hours to code and wasn't checked once in IE during the coding. Guess what? IE6 was identical in every way to Moz/FF+Op the very first time! My jaw dropped and I danced around the house like an idiot while the singer and bass player just stared at me as though I had lost the plot. I'm not going to pretend to be some kind of css-jedi that doesn't need to test in IE -- I was as surprised as anyone else would be. That declaration and a solid knowledge of when to throw in a 'position:relative;' were entirely responsible for slashing potentially up to an hour of debugging (depending on how many early evening beverages were consumed during ;) 2. If you were to pass your site on to others who were less aware of CSS, this method could cause great confusion. The method relies on an understanding that any used HTML elements will have to be specifically styled. If you were to pass your site to others who are less aware off css AND told them that they didn't have to worry about cancelling 'empty space' because everything was up to them, this method could cause great liberation. Well, I doubt it; but you get the idea. In the cases I've seen - mostly on codingforums.com - beginners develop bad cases of 'class-itis' due to a fear of using tag name selectors. This encourages/forces them to address the elements immedietly and individually; hopefully causing a greater focus on semantics in the process. ie What content does this page have? What tags will I use? instead of Hmm... better use another div for this sentance. High hopes, I know :\ We can't on the one hand say Don't rely on browser defaults and on the other say don't screw with the defaults -- future code monkeys will be confused. Each to their own; but you knew I wasn't going to agree from the get go. Lachlan wrote: I found out later that a significant portion of the class has now adopted it for their own stylesheets. That's fantastic :D I didn't think anyone would even care about such a simple tactic. Many thanks for sharing! ...and to finally get to Nick's question: Personally, I don't think I'll ever stop using it; but there's no prize for guessing I was going to say that. All the client sites I've done since using this trick (none of which have been added to my folio...Damn I'm slack!) have had the CSS split up into: - default.css [page layout only] - type.css [all global typography, starting with declarations like p, pre, blockquote, etc...] - any other site specific stuff (eg. menu.css) Splitting the css into positioning and typography can be very helpful in conjunction to the global reset, but you have to have your wits about you to keep things neat and well ordered. -- Andrew http://leftjustified.net ** 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] New website - please review www.astraroger.ro
http://www.astraroger.ro . Please take a look at it and tell me what you think. Don't be shy. :) Quick points: this (spaces using nbsp;): lia href=/despre/istorie/ id=m01 nbsp; nbsp; Istorie/a/li lia href=/despre/echipa/ id=m02 nbsp; nbsp; Echipa/a/li lia href=/despre/avantaje/ id=m03 nbsp; nbsp; Avantaje/a/li is the typographical equivalent of a spacer gif. Use padding or text-indent. Both are totally workable solutions. Also on the menu, instead of: ul id=produse li class=primeleimg src=/imagini/produse.gif alt=Produse Astra Roger //li lia href=/produse/ferestre/ id=m21nbsp;nbsp; Ferestre/a/li Having 1)images as headings and 2)those headings as list items seems a bit off target to me. If you were willing to go the 'image replacement' route you could do the following... h2Produse Astra Roger/h2 ul id=produse lia href=/produse/ferestre/ id=m21nbsp;nbsp; Ferestre/a/li ** edit: You haven't used a single header tag in the home page??! Impressively lean Flash markup - i still turn it off though, personal preference. ...and then there's this: img src=/imagini/copyright.gif alt= / Eeeww, images as text... You said not to be shy :D All the best, Andrew. -- http://leftjustified.net/ ** The discussion list for http://webstandardsgroup.org/ Proud presenters of Web Essentials 04 http://we04.com/ Web standards, accessibility, inspiration, knowledge To be held in Sydney, September 30 and October 1, 2004 See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] IE border dotted
IE 6 supports the dotted style - so long as the border width is above 2px. ...which totally sucks, because 1px dotted is nice ;) http://leftjustified.net/ ** The discussion list for http://webstandardsgroup.org/ Proud presenters of Web Essentials 04 http://we04.com/ Web standards, accessibility, inspiration, knowledge To be held in Sydney, September 30 and October 1, 2004 See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Testing render speed
** EDIT from above: It would seem that as of August 11th they have altered it to include images from CSS... This is one of those times I'm really glad I'm wrong :o As for home testing... Could you include some form of timestamp using php and then a javascvript onload function to work out the time difference? That's a wild guess, but it might just work. Andrew. http://leftjustified.net/ ** The discussion list for http://webstandardsgroup.org/ Proud presenters of Web Essentials 04 http://we04.com/ Web standards, accessibility, inspiration, knowledge To be held in Sydney, September 30 and October 1, 2004 See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Brisbane Meeting, Wednesday
I second that, it was a very interesting night... Thanks guys! ...and I third (?) that motion; most enjoyable. I've been looking for the web related design patterns that John mentioned, not sure if I've found it though. http://www.e-gineer.com/articles/design-patterns-in-web-programming.phtml http://www.appropriatesoftwarefoundation.org/cgi-bin/wiki.cgi?PatternsForDoingWebsites http://www.welie.com/patterns/ http://c2.com/cgi/wiki?WebsitePatterns ..and here's a page full of related resources http://www.pliant.org/personal/Tom_Erickson/InteractionPatterns.html Although in the end I think I just got lost in the web of dated documents. Andrew Krespanis http://leftjustified.net/ ** The discussion list for http://webstandardsgroup.org/ Proud presenters of Web Essentials 04 http://we04.com/ Web standards, accessibility, inspiration, knowledge To be held in Sydney, September 30 and October 1, 2004 See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
