Re: [WSG] Centering a liquid grid of image thumbs and captions
I'm with Mike - that's brilliant. It'll certainly fix my immediate needs. Thanks, Kristof! One question: what's this hack for? * html #images a { height: 100px; he\ight: 95px; } OK, I lied. Second question: your solution is very usable; I class this as 'elegant' because all the img/caption pairs are contained in one (open-ended) list. Just what I was after. But just out of interest, do you think it's possible to go one step further, and style the list so that the number of images in a row varies as window is resized - still keeping the 'grid' centred - for a truly liquid layout? Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Sunday, June 6, 2004, at 04:02 AM, Kristof Neirynck wrote: Nick Gleitzman wrote: I've been trying to emulate, with CSS alone, what I've been doing for years with tables: create a grid of thumbnails, each with a caption below, both image and caption linked to an enlargement. We all know how easy that is; center the table, center the cell content vertically, add some cell padding. Bingo. Any takers? [snip] Do you mean something like this? http://kristof.f2o.org/test/image_thumbs_and_captions/ -- Kristof * 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] Centering a liquid grid of image thumbs and captions
Roy - ummm, did I miss a post? Can you point me to 'Bert's layout'? Thanks Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Sunday, June 6, 2004, at 01:59 AM, RC Pierce wrote: Bert's thumbnail layout is really quite straight forward. Wish I'd o' thought of using inline paragraphs as containers when I was having trouble with a thumbnail page, myself. The problem of attaching caption to image, getting it to center with the thumbnail is completely overcome using that simple technique. Beats .td.img.br /.acaption./a./td (ignore dots) all to heck when it comes to elasticity and fluidity. Nice one, Bert. * 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] Centering a liquid grid of image thumbs and captions
Thanks, Bert - that's a different and very useful take on the problem. Er - Notwithstanding your PS, do you know how unwell your site is in Mac browsers? IE5 particularly - the only thing that shows up is the bgrd image (red at left). I think it's the height:100% that's doing it... If you want, I can send you some screenshots direct; I have a range of IE versions on both OS9 and OSX, and Safari 1 for OSX. Maybe some others might like to contribute sshots from other browsers? Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Sunday, June 6, 2004, at 02:05 PM, Bert Doorn wrote: G'day Sorry, I emailed direct rather than to the list. Here it is: I stay away from using NESTED tables I try to use DIVS only (and it's fine in simple layouts) I use a maximum of one table per page, if it makes life easier, such as where there is a complex layout, or where I have something that, with some imagination, could qualify as tabular data. Having said all that, if you can control the height of the captions, you could use divs or ps with a fixed height. Have a look at the portfolio page on my site (url in signature) for an example. I use paragraphs here, but you could use divs, an unordered list, or whatever :-) The beauty (to me) of this set up is that at different resolutoins you get a different number of thumbs across. For instance, at 800x600 I see 5 across, at 1024x768 there's 7 and at 1280x1024 I get as many as 9 across. P.S. I know this site isn't perfect. Am working on it. Regards -- Bert Doorn, Better Web Design www.betterwebdesign.com.au Fast-loading, user-friendly websites -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Nick Gleitzman Sent: Sunday, 6 June 2004 11:35 AM To: [EMAIL PROTECTED] Subject: Re: [WSG] Centering a liquid grid of image thumbs and captions Roy - ummm, did I miss a post? Can you point me to 'Bert's layout'? Thanks Nick * 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] What Editors do you guys use?
On a Mac: BBEdit, but I'm testing HyperEdit (still in beta) when I've got time because it offers real-time side-by-side comparison of code and result. Not 100% sure as yet of the rendering side, though... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Sunday, June 6, 2004, at 02:07 PM, helmut wrote: What CSS/XHTML/HTML editors do you guys use for hand coding and testing? * 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] Centering a liquid grid of image thumbs and captions
Wow. I (and no doubt every other Mac user in the world) will be shocked and deeply perturbed to discover that we've wasted our money. I wonder if Apple give refunds? Let me suggest that the direction this thread is taking should stop right here - it's gonna get off-topic (ie Mac v PC) really fast. I think most people will agree that a real web dev environment includes the ability to test across paltforms and browsers. 'Nuff said? Ah, but I can't resist this: I have 3 Windows 'boxes' (WIn2K/IE5.5, Win2K/IE6 and WinXP/IE6) running on my Mac. Can your PC do that? Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Sunday, June 6, 2004, at 02:49 PM, Bert Doorn wrote: I don't know how my site looks on a Mac (I don't have one and am not going to waste my money on one), but it's to be expected. * 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] Vertical Son of Suckerfish - Practical implementation
On Sunday, June 6, 2004, at 08:59 PM, Neerav wrote: Nick thats a top idea, have done as you suggest, adding links to the top level parts of the menu eg: Products. You're welcome. Im sure you know that the probability of IE X (the next version) being released as part of the next Windows Operating System is 100%, whereas the chance of M'soft releasing a new IE for Mac is 0% Agreed, but just because software is no longer developed doesn't mean people stop using it! Nick __ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Action to force browser developers to clean up their act
On Tuesday, June 8, 2004, at 08:11 PM, Giles Clark wrote: snip Isn't it about time we took a more active role in shaping the future of browsers. We could clearly state that as a community we write/develop for a list of acceptable browsers which comply to standards (we're just going to have to live wiht IE - market forces). Hopefully non-compliant browsers would simply not be developed, because the pages would break in it. If a new browser complies then it can see the pages we have developed. No worries. /snip - original post for full version 'We're just going to have to live with IE' - there's the rub. Over and over, in these threads, we see developers aiming their work at IE 'because it's the browser used by most people'. And why's that? Because it's integrated with the OS of the most popular computing platform on the planet. Never mind that it, and the OS, are lemons. The 'market forces' are one of the most successful business enterprises in history. IE is here to stay, whether we like it or not. Suggesting that we build sites that break in the most used browser and then telling the frustrated site visitors that their software's not up to it is committing our clients to commercial suicide. You'd probably be amazed, and alarmed, at the proportion of people out there that don't even know that they have a choice when it comes to browsers. They use what comes pre-loaded on their PC; they allow auto updates (maybe); they get a new browser when they get a new PC. As developers, we need to remember that not all our site visitors spend as many hours in front of their PCs as we do. They don't understand Standards, and they don't want to. Their maxim: 'Don't make me think.' If a site works, fine. Our clients, with our help, can communicate with them, hopefully in a meaningful way. If it doesn't, we've lost them. And they won't be back. All they know, or care about, is that 'this site doesn't work'. There's a hundred mores sites just waiting in the wings to supply whatever yours couldn't. The best route to change of a system you don't agree with is from within. Get a job at Microsoft, and bring all the influence to bear that you can to ensure that their next generation browser - codenamed Wombat, or Aardvaark, or whatever it is - is Standards compliant. But let's be realistic: legacy browsers, pain in the arse that they are, aren't going away for a few years yet. So let's make our sites work in them. We're in the communication business, yes? (Note: 'Clients' means anyone a site is being built for - including yourself. Doesn't mean money has to change hands.) I think that's 3c - Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Action to force browser developers to clean up their act
On Wednesday, June 9, 2004, at 01:41 AM, [EMAIL PROTECTED] wrote: If we are going to make sites that only work in certain browsers why not just code to IE's standards and not bother with the obscure browsers like firefox and opera. That way we don't need standards at all! I can have my marquee tag back and my ActiveX controls - Ill be able to do all kinds of great things. After all nearly everyone uses IE... Seriously though, If you are going to take this hardline attitude by purposefully excluding users of certain browsers then you may as well do what I was saying above. Don't loose site of the objective - with standards we are trying to let more browsers work with our sites not less. Don't get too bitter about IE people it's not good for your health. No, no - I'm not suggesting for a second we should *only* develop for IE, or any other certain browsers! Just the opposite - I make a point of delivering my clients' message to the maximum number of visitors. And I'm not bitter; just realistic. That's why I say 'IE is here to stay'. Thanks to the many gurus around, we have a whole menu of hacks available so we *can* deliver Standards-driven sites to non-compliant browsers. I just think we have to keep an eye on the past, even as we move forward. Someone said in a recent post on another thread, 'IE/Mac is no longer being developed, so it's a dead duck.' Huh? Did all the IE/Mac users just stop, there and then, when that news was announced? No - and that's why I'll keep hacking for, and testing in, the widest possible range of browsers I can. I owe it to my clients. 100% compliant browsers. Write once, publish anywhere. It's the dream of Standards, right? I'm all for it; I'll do my bit, and more. But it's not the real world - not yet. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] www.seoed.com - Please review
My comments are mainly about the interface: Can I suggest you use a list for the navigation bar at top? You have for the one at bottom... Maybe a bit more contrast in that navbar? even a bit more padding around the words themselves? You might like to look at the way the word 'SEOed' is rendered across the site; I count about five variations. If you're going to deliver a site in English, you should be extra careful to check spelling and grammar. You have some errors that need to be fixed. (Presume that English is not your first language.) Hope this helps. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Monday, June 9, 2003, at 01:47 AM, Razvan Pop wrote: Hello. http://www.seoed.com/ Please take a look at my site and tell me what you think. :) I would like some more opinions regarding usability and accessibility. I look forward for your feedback. Site in 90% finished. * 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] Action to force browser developers to clean up their act
On Wednesday, June 9, 2004, at 10:26 AM, Peter Firminger wrote: Could it be that your site is broken, not the browser? We don't have any trouble accommodating IE with standards compliant code. I think your taking the argument too far and blaming the tool. There are very few issues remaining if you code your page thoughtfully (not in quirks mode) and ignore the features (like attribute selectors) that don't work in IE. Get over it. Giles' original post said I'm pissed off trying to fix a lump of code that is apparently compliant but breaks in one browser because some halfwit can't be bothered to develop compliant software. Ironically, he didn't say which browser - but having also suggested that 'we have to live with IE' because of 'market forces', the inference was there. My answer to Giles was supposed to say, just as you have, 'Get over it.' I obviously have to stop contributing so late at night. N ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] IE-Win / Floated List Issue
On Wednesday, June 9, 2004, at 01:51 PM, Michael Donnermeyer wrote: The Chapters are in an unordered list that's displayed inline and floated to the left. Of course the more proper browsers (Safari, Mozillas, Opera, IE-Mac) are handling everything correctly...IE Win however has decided to be a monster (imagine that). MD, this was just a real quick look, but I can't see where you have the lis floated; they are just inline. Have a look at the solution Kristof came up with recently on a similar issue: http://kristof.f2o.org/test/image_thumbs_and_captions/ I think you'll be able to adapt his code pretty quickly. Hope this helps. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] How to Make Your Web Site Work with Windows XP Service Pack 2
On Thursday, June 10, 2004, at 10:40 AM, Neerav wrote: I foresee in my crystal ball a lot of headaches for web developers who use popups Heres something that might help http://msdn.microsoft.com/library/default.asp?url=/library/en-us/ dnwxp/html/xpsp2websites.asp Anybody else get a 404 appearing in the LH column at the URL above? :-0 N ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] How to Make Your Web Site Work with Windows XP Service Pack 2
The link worked OK; the space happened when I quoted your original message. I've sent you a screenshot direct to show you what I mean... N ___ Omnivision. Websight. http://www.omnivision.com.au/ On Thursday, June 10, 2004, at 12:25 PM, Neerav wrote: theres should be no space between en-us/ and dnwxp in the link -- Neerav Bhatt http://www.bhatt.id.au Web Development IT consultancy Mobile: +61 403 8000 27 Nick Gleitzman wrote: On Thursday, June 10, 2004, at 10:40 AM, Neerav wrote: I foresee in my crystal ball a lot of headaches for web developers who use popups Heres something that might help http://msdn.microsoft.com/library/default.asp?url=/library/en-us/ dnwxp/html/xpsp2websites.asp Anybody else get a 404 appearing in the LH column at the URL above? :-0 * 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] HTML email - mac testers please
Mark: Mac OSX comes with a prog called Mail (known as Apple Mail), then there's, I guess, Entourage for MS Office users, Outlook Express, Eudora - and others. I use Mail - which by logic should use the Safari engine for rendering HTML - but I've had similar problems with unwanted white space in my messages as rendered by Mail. The bad news is, I gave up on trying to fix it, and loosened the layout to compensate - not an option in your case, I can see. One hint, though - my problem had to do with table cells as well, and I've an idea that it has something to do with font sizes and baselines, even if there's no text in the cell. Mind you, I wasn't using pure CSS for the layout; I stick with traditional bloated HTML for maximum compatibility. My main concern is the browser-based mail clients - Hotmail et al - that do horrible things to CSS-based emails. See article on A List Apart http://www.alistapart.com/articles/cssemail/ for more info... BTW, your mockup renders fine in Safari 1.0.2 and IE5.2.2 (on OSX 10.2.8). Let me know direct if you want screenshots. G'luck! Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Thursday, June 10, 2004, at 01:08 PM, Mark Stanton wrote: Hi All I've got an HTML email that I need to prepare for a client. The mockup can be seen at: HTML: http://mark.gruden.com/beerworth/ CSS: http://mark.gruden.com/beerworth/lib/main.css We didn't design it, we just did the HTML CSS work. An initial review by the designers (MAC users) has resulted in them coming back saying there are padding/margin issues on Safari 1.1.1 and IE 5.2. Bascially the blue area on the right side (the bit starting with You are subscribed to...) has a couple of pixels white space at the top bottom. This blue should be sitting flush with the header footer. I've tested it on IE 5.1.7 (it looks fine), but don't have access to either of these other browsers. I've got two questions: 1) What mail client are available on the MAC and what browsers do they use for rendering HTML content? 2) What is causing this issue and what can I do to fix it? Thanks in advance. Mark -- Mark Stanton Technical Director Gruden Pty Ltd Tel: +61 2 9299 9462 Fax: +61 2 9299 9463 Mob: +61 410 458 201 http://www.gruden.com mailto:[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 *
Re: [WSG] KHTML ??
On Friday, June 11, 2004, at 06:56 PM, t94xr.net.nz webmaster wrote: just in the art of humur? What is Google? Camz :D www.fuckingkhtmlit.com N ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] First table-free site
On Saturday, June 12, 2004, at 01:08 AM, Mary Wright wrote: - there seems to be an extra 5px padding above and to the left of the image in the banner div - Hi Mary Looks to me like there's an extra 5px all round the banner img - could it be the padding: 5px declared for the div#banner that's doing it? The 10px padding on the div#container should be enough (I'm assuming the banner img should align L R with the edges of the grey bar and the blue box). Also, I'm pretty sure (but happy to stand corrected by others on this list) that you can't declare margin: none for img - it should be margin: 0. Nice looking site, though. Hope this helps.., Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] First table-free site
On Saturday, June 12, 2004, at 01:58 AM, Iain Gardiner wrote: I've had a look at the site and CSS (nice-looking by the way) and although I am pretty poor at analysing other people's problems, I think it might come down to theis rule: #sidebar-a { float: left; width: 100px; \width: 110px; /* Try removing this line */ w\idth: 100px; /* And this one */ margin: 0; margin-right: 5px; padding: 5px; background-color: rgb(235, 235, 235); } I assume you want it to be just 100px in width, but in Firefox at least it is being rendered as 110px. To my mind this would explain the extra 5px at either side of the logo. Try without the lines I've indicated above and see if that makes a difference. If Iain's right (and I think he almost is), you should do the same for the width declarations for div#container as well. Not sure that you've got the hack right - IE5 can still see the \width declaration with the leading slash. The w\idth declaration will work for IE5 if the width needs to be different, but it's not complete See http://www.info.com.ph/~etan/w3pantheon/style/modifiedsbmh.html for full info on this simplified version of the Box Model hack... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] First table-free site
On Saturday, June 12, 2004, at 01:08 AM, Mary Wright wrote: - there seems to be an extra 5px padding above and to the left of the image in the banner div - Mary - forgot to mention: the overall width of div#container in Safari 1.0.2 is 730px, but you've declared it at 710px - so the extra 'padding' around the banner is actually extra width on the container. Put this together with previous comments from us all and I think you'll crack it. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] ma\rgin-right
On Saturday, June 12, 2004, at 09:03 AM, Christopher Kennon wrote: Hi, Where can I read about this work around? Chris Not sure if this works on all selectors, but try http://www.info.com.ph/~etan/w3pantheon/style/modifiedsbmh.html Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] scrolling area
On Monday, June 14, 2004, at 11:29 PM, Justin French wrote: So, I'd like to experiment with a javascript/css based solution which (preferably) is 100% accessible, based on a scroll box with simple up and down arrows, etc. Justin, take a look at the solution I came up with for two sites last year - same request from client (who was the designer) to remove the system-based scrollbars on frames (Frames? Gasp!). http://www.foleys.com.au/ http://www.marinepark.com.au/facilities.htm (the end client has got hold of this since delivery and done some DIY additions - check out the Home page... eek!) ***Warning*** These are pre-Standards era sites for me... just don't give me a hard time, OK? Not sure about the accessibility issue, but the javascript works OK. I actually pointed out to the designer at the time that lack of javascript would mean that the site couldn't be navigated, but I got the 'That's OK, all our visitors have IE/Win' line... Huh. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] overflow: auto;
On Tuesday, June 15, 2004, at 04:29 PM, Rick Faaberg wrote: On 6/14/04 11:21 PM t94xr.net.nz webmaster [EMAIL PROTECTED]> sent this out: excellent example www.t94xr.net.nz/plinks/ http://www.t94xr.net.nz/plinks/> Camz Doesn't work in Safari, though? Rick Faaberg Which Safari? Works OK in 1.0.2 on 10.2.8... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/
Re: [WSG] Have stared too long
On Thursday, June 17, 2004, at 06:36 AM, Veine K Vikberg wrote: My main problem is the blasted unordered list where the bullets disappear in IE, and the picture going off to the left in Opera. I don't see any css declaration at all for the ul; add one and you can control bullet position. For the image, declare a width for the float in your css. Also, I looked at the page in Safari; you need to address some whitespace issues as well. The buttons in your #navbox are wrapping to a second line. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Middle Div gets shoved around in IE
On Thursday, June 17, 2004, at 02:40 PM, Roger Williams wrote: In IE for Mac or PC the middle div gets bumped around: www.yogavillage.net I have set all the widths accordingly and the middle div gets a min-width of 430 px which is wider than the center graphic. Any ideas? i have a feeling that this is an IE hack but I have no idea which one. Checked in IE5.2 and Safari 1.0.2 on OSX 10.2.8, and IE5.5 on Win2K ... all looks fine to me - ? What exactly do you mean by 'bumped around'? My only criticism of the whole layout is that the 'Location' link li needs a right border... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Middle Div gets shoved around in IE
On Sunday, June 20, 2004, at 04:37 AM, Roger Williams wrote: When the browser is reduced in width to less than 800px the middle content gets shoved down. If the browser is wider then everything is fine. OK, on closer observation: Safari 1.0.2: the #middle div doesn't get shoved down; a horizontal scrollbar appears at 795px width or less. IE5.2: acquires a horizontal scrollbar at 698px; #middle div shrinks in width to a minimum of the longest word contained within it, #pagetitle image overlaps with right column, until eventually, at 370 px width, the #middle div drops below the two floated columns. Seems that IE doesn't honour 'min-width'. For the 'correct' approach, suggest you check out one of the many online resources on floats (and clears); I think that your standard 'header, 3 column, left and right floated' layout is suffereing because of the pagetitle img. This floated layout always points out that a long element (word, image, URL etc) will break the layout. Try http://www.macedition.com/cb/ie5macbugs/ for starters. Or, try absolute positioning for your L and R columns instead of floats. A quick fix might be to re-make your gifs so as to place the 'yoga village' and 'better world' gifs (both blue background) in the #header div, and let their default (non-overlapping) width define the page's min-width. Not exactly in the spirit of Standards, I guess, but there again, as things stand, you effectively have no ID of the page as 'Yoga Village' if imags are turned off... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] pixel to ems converter
On Monday, June 21, 2004, at 05:11 PM, Michael Andrews wrote: Hi, Just thought I ask if there is bit of math or a web site that can accurately convert pixels to ems. If I want to size an image in ems so it will scale with text re-sizing I kinda doing it manually at the moment by dividing by 12 and guessing from there. I thought there might be a site somewhere that you select your font etc and imput you pixel size and it does an acurate conversion. Or am I dreamm..in' Thanks if anyone can answer No, you're definitely dreamin'. An 'em' is different from font to font - it refers to the width of a character, and the same character is a different width in different fonts. Ems are proportional measurements. You have to define pixel dimensions for images because they're made up of pixels. In any case, if an image is rendered by a browser at anything other than its actual pixel dimensions it usually looks pretty ropy. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Problem with floated divs in gallery site
On Thursday, June 24, 2004, at 09:31 PM, John Penlington wrote: No problem getting the thumbnail-caption combinations to display using left floated divs - thanks to Russ Weakley's float tutorials. But I just cannot find the way to get these thumbnail-caption combinations to align at the *bottom* - rather than the top where they are now. I'm with you, mate - I'd love to know how to do this without the need for additional css for each and every thumbnail. I've researched this myself, and as far as I could determine, the (only?) way to bottom-align a row of floated divs is to declare the height of the divs for the tallest img, and then add padding-top to *each* img to force the alignment to the bottom. Clumsy, and a pain to update. Much as I hate it, I've yet to find a way to quickly and cleanly align a grid of thumbs as I can using table cells. You might like to check out the threads 'IE Max-width Emulation and Auto Centre' and 'Centering a liquid grid of image thumbs and captions' from the first week of June - this issue was discussed at some length (although maybe not bottom-alignment...) Nick ___ Omnivision. Websight. http://www.omnivision.com.au/
Re: [WSG] Problem with floated divs in gallery site
On Thursday, June 24, 2004, at 11:01 PM, Trusz, Andrew wrote: Couple of industrial strength options; both of which I've used. One is purely visual - organize the pictures by height. The pictures seem to come in roughly two heights so group them that way and they will mostly take care of themselves. You may have an odd transitional line from tall to short depending oh how many pictures you have. No good if the client insists their thumbnails are presented in a specific order - which mine (photographers) invariably do. The alternative is to pad the pictures. You've done it for width, just do it for height. It's more complicated but the same principle. You know how tall the tallest thumbnail is going to be. Pad all the pictures to that height. You can split the height and thereby center the pictures, with text at the foot of container, or pad completely on top and push them all to the bottom. This way you can mix and match tall and short. That's what I suggested, but it's a labour-intensive solution, and doesn't help me in coding a dynamic site with 5000+ thumbnails - when the thumbs displayed are a (subset and a) result of a database query. In effect, I have to code a page that will have an unknown number of thumbs, with an unknown mix of horizontal and vertical aspect ratios, in an unknown order. That's why I'm seeking an 'elegant' (ie common and minimum css) solution... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/
Re: [WSG] Problem with floated divs in gallery site
On Friday, June 25, 2004, at 12:22 AM, John Penlington wrote: I just cannot find a CSS way to emulate the table cell attribute *valign='bottom'*. If I can do that, I can solve the problem. In the embedded CSS I've used a class table.gallery{vertical-align: bottom; ...} and it works with the table, but it won't work when added to the .thumbnail class div. Yup, there's the rub: 'vertical-align' only works on text. I found that out by TE while trying to solve this one. I think maybe Drew Trusz has the right approach: use a css table... BTW, interesting to view your source - the table-based version really wasn't that much more code than the css-based - and if you use css to style your table, you'll cut the code even more... Oh, and what's with the non-breaking spaces in the floated divs? ;-) Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Importing hacks into CSS? Whats the point?
On Monday, June 28, 2004, at 12:01 PM, Lachlan Hardy wrote: I'm with Mike on this. I don't see a benefit. In fact, when I read the article it looked like more work to me : 1. Hacks in main CSS file - Hack gets outdated, edit CSS file and remove hack 2. Hacks in separate CSS file - Hack gets outdated, edit CSS file and remove import, then delete separate hack file There is an extra step. No huge difference, so I'd be willing to do it for a benefit, but I just don't see one. If (and I think this is what Mike was asking) anyone can demonstrate a potential benefit from this process, please enlighten me (us) Cheers, Lachlan Your way: open css file, search thru (possibly) 100s of lines of code to locate hack, double-check selector so you're removing the hack on the right declaration, repeat, rinse, save and close, upload. My way: open css file, delete one @import rule (line #1), save, close, upload. Delete css hacks file. There may be an extra file involved, but I know which is faster... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Horizontal List problem in IE
Hard to tell exactly without seeing full context (a link is better than a code extract), but why not do this and avoid the nested list: ul liDaddy raquo;/li li/li lia href=#Child A/anbsp; |/li lia href=# Child B/anbsp; |/li lia href=# Child C/anbsp; |/li lia href=# Child D/anbsp; |/li /ul Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Tuesday, June 29, 2004, at 10:12 PM, JW wrote: Hi I am having problem with my horizontal list IE as 'Child A-D li' is showing at the bottom of 'Daddy li'. It looks fine in Firefox and Opera 7. They are all floated to the left in a straight line. ul liDaddy raquo;/li ul lia href=#Child A/anbsp; |/li lia href=# Child B/anbsp; |/li lia href=# Child C/anbsp; |/li lia href=# Child D/anbsp; |/li /ul /ul CSS as follow: #menuSub { font-family : Verdana, Helvetica, Arial, sans-serif, Geneva; color : #D6D7C8; font-size : 12px; font-weight : bold; clear : both; padding : 12px 10px 0px 7px; } #menuSub ul {display: inline; margin: 0; padding: 0;} #menuSub li {padding-right: 10px; float: left;} #menuSub li a {color: #A5A682; text-decoration: none;} #menuSub li a:hover, #menuSub li a#menuSub-selected {color: #C2AC52;} The final effect should show as: Daddy Child A | Child B | Child C | Child D And not: Daddy Child A | Child B | Child C | Child D Best Wishes, Jaime ... * 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] What do browsers download?
On Wednesday, June 30, 2004, at 10:43 AM, Tim Lucas wrote: I know that for Gecko based browsers background images defined in stylesheets (inline or linked) are deferred from loading until they are asked to display themselves. This also helps because many style sheet rules containing images often don't apply to the elements of the current page. In contrast, I've noticed that images called by css files (as div backgrounds) *all* download in IE and Safari on Mac (not sure about IEWin) - which is why I stopped using a single css file for multiple pages with different images. The first-time download wait is horrendous. Zeldman was using images in div backgrounds for his page headers a while back, and his Home page was loading the header graphics for 3 or 4 other pages too... He stopped doing so with his next redesign... The advantage, of course, is that when you navigate to a page for which the image file has already downloaded, it renders instantly - but I equate that with waiting for a Flash download to give instant access to an entire interface. I'd rather see elements downloaded only as they're needed to actually display. I write separate css files for calls for image files and link to them from the html pages as needed. Clumsy, but faster for the visitor... Not sure if this getting OT - I think not, as bandwidth and site speed is one of the aims of Standards? Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Please use plain text in emails
On Monday, July 5, 2004, at 02:58 PM, Hugh Todd wrote: We've had many, many calls for emails to this list to be posted in plain text rather than HTML or rich text. May I reiterate the call? A fair number of recent emails have shown up in my email client with tiny, hard-to-read text. So, please use plain text in emails if you want to be read. Hear, hear. Try View Source on a HTML or RT message - tag soup, with croutons! We spend so much energy on Standards for our sites - how about applying the principals to mail? The messages will be smaller, quicker - everyone will benefit, not the least the list admin! Thanks - Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] hand coding versus code generators
On Monday, July 5, 2004, at 08:49 PM, simon @ london web mill wrote: Im a new boy to the discussion group. Pointed in this direction by Jeffery Zeldman's 'Designing with Web Standards'. I must say Web Standards has been a 'breathe of fresh air' for me. Its the way forward, for sure. What Im not so sure about is using a code generator eg. Dreamweaver. Ive always hand coded my HTML, javascript, ASP, SQL etc using a text editor (past 4 years). What do people think about hand coding versus code generators? What percentage of developers totally hand code, use both, use only code generators? regards Simon BBEdit - worth it's weight in gold. Any text editor that can give you syntax colouring is an absolute must. I have and use DW as well, although MX2004 is new for me and I haven't tested it thoroughly yet. As yet, not convinced it can handle CSS layouts using floats correctly, but the jury's still out... Generally, I trust WYSIWYG editors about as much as I trust IE6 to render my code correctly. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] id or class on html or body
On Saturday, Jul 10, 2004, at 02:37 Australia/Sydney, Justin French wrote: - trigger active and inactive tabs on a menu navigation (can't think of an example) http://www.alistapart.com/articles/slidingdoors/ http://www.alistapart.com/articles/slidingdoors2/ N ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] setting width for lis when inline
On Tuesday, Jul 13, 2004, at 07:32 Australia/Sydney, Scott Reston wrote: I'm attempting to build a horizontal menu that from an unordered list. My plan is to provide the list as text in the html, then use an image-replacement scheme (ala http://www.mezzoblue.com/tests/revised-image-replacement/) to swap out the text with images. It looks to me like image-replacement depends on me being able to set the width of the containing element, in my case, an a I want the CSS to work without being altered, whether i include all of the li menu items or not, so I don't know how wide the overall ul will be when the page is actually created. Is it possible to set width on an inline element? Can I get the same effect from some sort of absolute positioning (when i don't know the widths of elements)? Check out Doug Bowman's Sliding Doors on A List Apart: http://www.alistapart.com/articles/slidingdoors2/ I've used it on one of my sites, and it's brilliant. The width of the li is determined by the text content of the a - once it's set, all you need to do is add lis with text links. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] CSS Opacity
On Tuesday, Jul 13, 2004, at 22:03 Australia/Sydney, Joe Leech wrote: I know this really isn't strictly *standard* but... I am using the css level 3 opacity property (and using the alpha filter for IE) for various content boxes to show the background image. However, I have just placed an image in the opaque block and it is opaque - but I don't want it to be. Is there a way to turn off the opacity of top image? The site is here: http://www.josephleech.co.uk/wordpress/ and the CSS: http://www.josephleech.co.uk/wordpress/wp-layout.css Thanks in advance, joe Wow, Joe - opacity issues aside, spare a thought for your visitors who don't have broadband! 400KB for your weymouth jpeg? I've built sites smaller than that... ;) Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] CSS Tabs
On Friday, Jul 16, 2004, at 10:08 Australia/Sydney, Jad Madi wrote: hmm what I want is , for example http://www.alistapart.com/d/slidingdoors2/v1/ex10a.html# when I click on any tab to be active? How to do it? On Fri, 16 Jul 2004 09:37:28 +1000, Dave Rayner [EMAIL PROTECTED] wrote: If you mean tab menu then look at these: http://www.alistapart.com/articles/slidingdoors/ http://www.alistapart.com/articles/slidingdoors2/ I have used these and they are really cool dave rayner I'm with Dave - Sliding Doors are the go. But what exactly do you mean by 'when I click on any tab to be active'? Can you be a bit clearer/more specific? Also - what browser/platform are you using to view Sliding Doors example? It's compatibility is not 100%... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Strange padding in IE?
On Tuesday, Jul 20, 2004, at 16:05 Australia/Sydney, James Cowperthwaite wrote: The layout problem occurs in IE (fine in mozilla). I want to keep the text flowing down the page in a straight line, but in IE when the text passes the end of the blue box, it moves in by 1 or 2 pixels (illustrated by the green left border for #main). I have boiled away the code to the following http://www.moomail.com.au/csspain/ http://www.moomail.com.au/csspain/painful.css Anyone have any ideas? James, see http://www.positioniseverything.net/explorer/threepxtest.html Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Is Mac IE 5 Support (Worth) It ?
On Wednesday, Jul 21, 2004, at 18:21 Australia/Sydney, Neerav wrote: http://photomatt.net/2004/07/16/mac-ie/ Current stats from Apple indicate that around 50% of Mac users worldwide have made the move to OSX. The other half - still on OS9.x - are very likely to be using IE5. Even some OSX users still do - I have one client on OSX whose browser is IE5; when I suggested she use Safari her reaction was, Safari? What's that? She had also not even heard of Opera, or Firefox. Remember that few people are as 'browser-aware' as we developers. Most people just want to get on with their lives and businesses. The technology they use to do so should be, ideally for them, transparent. So for now, yes, I test and hack where necessary for IE5. To not do so is to effectively replace the question with 'Is Mac support worth it?' IE5.x/Win probably returns similar stats to IE/Mac in most site logs. Do we ignore it as a target browser, too? Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] css and cms (elegant product sought)
On Friday, Jul 23, 2004, at 13:44 Australia/Sydney, Roly wrote: a couple of questions, somewhat off topic I would like to capture an image of the the whole html page i.e. what is not visible in the scroll region, so the image would capture something like an 800 x 3000 region to be printed in a brochure. Take screenshots of each visible section as you scroll down, and stitch them in Photoshop. I am looking for an elegant CMS tool which will still supports CSS and which will allow me to create a 5 or 7 page user editable website. Mamboserver and similari CMS products are way to big for the clients I am currently working with. Macromedia's Contribute is pretty good, for a reasonable price - if you use DW. Regards Roly hth Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] CSS Drop down menu - Bugfix IE
On Wednesday, Jul 28, 2004, at 02:04 Australia/Sydney, Siteman DA - Bent Inge wrote: I'm aware of the problem with list items, and it sucks... But the markup (http://www.regnskapsbyraet.no/sider/designmal.php) can't be changed in order for the menu to work. So the changes has to be made in the stylesheet (http://www.regnskapsbyraet.no/sider/global.css) So - is there some way of tricking IE for this excact type of listmenu? Have you tried {whitespace: nowrap;} on the offending ul? Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] pagesauce.com
You might also be interested in Zeldman's coverage of this concept at http://www.zeldman.com/daily/0704d.shtml - including the hassle that one UK coder experienced as a result... I'd be very careful about publishing reworked versions of other people's copyrighted materials, even if you have the best intentions. Don't get me wrong - I applaud what you're doing, but these big corporations can play a lot harder than you. Just my 2c. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Wednesday, Aug 4, 2004, at 18:45 Australia/Sydney, Tim Yang wrote: Hi I'm just floating an idea. I was quite interested several months ago in re-doing some big non-standards sites like slate.com into standards compliance for my portfolio. I also just wanted to find out if I had the skills to meet the challenge. It was a really interesting experience when I forced myself to re-create what was once a tabled site just using CSS and XHTML. I re-markedup the home page of afl.com.au over a period of about a month. And when I told my after-work project to a few designers, they were really interested in it. So I created a website to explain what I was doing. It's at http://pagesauce.com/ Just tell me if I'm just plain nuts, ok? Or if I just the whole thing wrong. Tim * 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] layout problem
Using IE5 as your default browser for development is going to give you these headaches every time. Build to a Standards-compliant browser - Firefox is probably best if you're on a Mac - and *then* use the hacks you need for IE5, but only if you *really* need to. Good css shouldn't require much/many - if any. BTW, a couple of points about your markup: - Use margins/padding in your css to control paragraph spacing; all those br / tags are unnecessary. - Your LH nav is a list of links - use a ul to mark it up. Again, you can control vertical spacing between the links with your css - which is much more flexible than locking the links into p tags. See Russ Weakley's Listutorial http://css.maxdesign.com.au/listutorial/ for everything you ever wanted to know about lists. HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Saturday, Aug 7, 2004, at 02:38 Australia/Sydney, Barry Cranmer wrote: http://orderlyspaces.com/fri86.html orderlyspaces.com/fri86.css The page displays as I would like it to in IE 5.2 on my Mac (G4 running OS X 10.2.8), but does not work properly in Safari, Firefox, Opera or AOL's. browser on Mac. The problem is that the content, beginning with the quote on the right overlaps the header in every browser I have available but IE. Mozilla on a PC yesterday had the same problem. (I don't have access to IE on a PC and have no idea yet what THAT mess might look like.) The quote and the top item of the menu pretty much line up horizontally in IE (Mac) and that's how I hope to make it work cross-platform and cross-browser. I'm new to css and I'm probably missing something simple or doing something completely backwards, but I'm stumped. I've tried using some suggested hacks and they have helped me get to this point, but I'm not sure I've got them right either. I would appreciate any guidance anyone could offer. Thanks in advance for any suggestions! Barry Cranmer ** 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] Doctype Javascript and accessibility
On Tuesday, Aug 10, 2004, at 22:46 Australia/Sydney, Nancy Johnson wrote: I am having trouble with server side includes working with documents ending in .htm or .html. They only seem to work with .asp documents. Change the file suffixes to .shtm or .shtml and your includes should work OK. BTW, the include file itself doesn't have to be a .htm file - in fact it shouldn't be. Consider, if the include file has the markup to make it a .htm file (ie html, head, body tags and all the rest), when that code is called into the destination file, it will duplicate what's already there. The include file itself can just be whatever code fragment you want to call into your pages, and saved as a .inc or even a .txt file. HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] =?iso-8859-1?Q?Why_does_this_floated_text_not_show_up_in_IE??=
Couple of real quick guesses: 1. You have both those classes styled with text-decoration: none. As they're not links, that's redundant. Remove those styles. 2. Try giving the classes in question declared widths. 3. Actually, it may be the z-index value for the containing #information - ? It's 2am here and I'm fading... My approach would be to pare down the css to the minimum that's required to make the page structure work, then add presentational declarations back in one at a time until those two classes disappear... A passing comment: while all your credits and comments in the stylesheet are nice, they're making the stylesheet for what is a clean simple page of code somewhat bloated... By all means include brief notes to ID the hacks you're using, but these mini-essays defeat the purpose of using XHTML to de-bloat your code - don't you think? And while you're cutting bloat, all those 0px values can be just 0. 0 is 0, whether it's px, ems, or anything else. Oh, and try using relative font sizes, rather than px; Windows users can't resize your type if they want to when you use 11px as a font size. HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Thursday, Aug 12, 2004, at 00:42 Australia/Sydney, [EMAIL PROTECTED] wrote: site: http://www.college.gameplan.org.uk css: http://www.college.gameplan.org.uk/college.css This site looks exactly as I want it in Firefox but in IE the Vistor Number and Site Version Number don't appear, although you can see the entries in the source code!! I have validated the XHTML and CSS. Can anyone shed any light on what I am missing here or which IE bug I have hit? Thanks Alan ** 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] =?iso-8859-1?Q?Why_does_this_floated_text_not_show_up_in_IE??=
I was wrong on all 3 counts. It's the IE Peekaboo bug; add height:1% to your .credit declaration and the two floated classes appear... but the black border of #information is then affected... bugger. It's too late in the day; I'll have another look tomorrow, if someone hasn't already come up with a simple and elegant solution - which they will... Love this list. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Thursday, Aug 12, 2004, at 00:42 Australia/Sydney, [EMAIL PROTECTED] wrote: site: http://www.college.gameplan.org.uk css: http://www.college.gameplan.org.uk/college.css This site looks exactly as I want it in Firefox but in IE the Vistor Number and Site Version Number don't appear, although you can see the entries in the source code!! I have validated the XHTML and CSS. Can anyone shed any light on what I am missing here or which IE bug I have hit? Thanks Alan ** 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] Why does this floated text not show up in IE?
On Thursday, Aug 12, 2004, at 02:09 Australia/Sydney, Owen Gregory wrote: Nick Gleitzman wrote: Oh, and try using relative font sizes, rather than px; Windows users can't resize your type if they want to when you use 11px as a font size. You must be fading, Nick. It's IE/Windows users who aren't able to resize pixel-sized text. Mozilla, Opera et al can all resize text in pixels, even on Windows. ;) Owen Duh. Of course. Well, told ya it was late... ;o) N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] Image size--where should it be?
On Friday, Aug 13, 2004, at 09:59 Australia/Sydney, Edd Hale wrote: I am new to CSS and I am not sure if the image size (width and height) should appear in the HTML or be handled by CSS. Thank you. Edd Aside from the validity/informational/decorative issues, the inclusion of width and height attributes allows the browser to lay out the page in its final form the first time it renders the code. If width and height are not declared either inline or in the external CSS file, the browser will render a very small 'placeholder' for the image/s as it first renders the page, then rewrite the page with each image that is downloaded and added, causing the content to jump around. Whether this jumpy rewriting is acceptable to you for your visitors' experience of your site is a personal decision. Myself, I like to specify all widths and heights - either for images themselves or for their containing elements - so the page is drawn 'correctly' first time, with full-sized 'placeholders' for images (even if they're just holes in the layout) that are filled as images download. My 2c. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] Can someone reproduce these issues for me please?
On Tuesday, Aug 17, 2004, at 09:38 Australia/Sydney, Seona Bellamy wrote: I have a couple of issues with the site I'm working on. They have been reported by the client, and I'm having trouble reliably replicating any of them so I can't work out how to fix them. Can someone please take a look at http://216.119.123.23/ and look for the following errors: * On pages like About Us and Contact Details, the centre banner apparently stays stuck at the top of the screen (i.e., the content of the page disappears under it as you scroll, and it's always on screen). Does anyone else get this problem? I don't. More importantly, if anyone else does, how do I make it stay in place? Sounds like an issue with position: fixed. There again, if by 'centre banner' you mean the Flash file, it doesn't validate... Suggest you search the archive on this list for valid ways to include Flash files, or look for Flash Satay at A List Apart. * If you browse the catalogue, sometimes the product listings don't come up straight away. The page loads, finishes loading, and expands to its required height, but the content doesn't show up until you roll your mouse over a link. Then it magically pops into view. I only get this problem sometimes, they apparently get it all the time, and I can't figure out why it's happening. Sounds like either the Peekaboo or Guillotine bug. See http://www.positioniseverything.net/ for fixes. * In the View Details page for any of the products, there should be an Enquire Now button. It's there on mine. It's not there on the client's. They don't believe that it's really there at all, in spite of the fact that I can look in the code and see it. I presume the button is a form element. Form elements are really touchy in XHTML. Again, search the archive for clues. Difficult to be any more precise without info on what browser you're developing/testing on, and what browsers are showing the problem. Also, step one should *always* be to validate your code. You'll be chasing your tail for days, otherwise. If your client is seeing glitches with an old, non-compliant browser, suggest to him that he updates it. If he objects on the basis that some visitors will still get the problem show him how small the percentage is of visitors to his site who are actually using the old/bad browser - I bet it's tiny. If that doesn't work, stop trying to use XHTML. HTML4 is perfectly valid, and can still be Standards-compliant. We don't *have* to use XHTML; design and usability should come first. See http://www.zeldman.com/daily/0804b.shtml for an interesting take on this. HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] list item markers disappear behind floated image
Pete, that's not a drawback - that's what list-style-position: inside is intended to do! N ___ Omnivision. Websight. http://www.omnivision.com.au/ On Wednesday, Aug 18, 2004, at 09:45 Australia/Sydney, Peter Ottery wrote: the only drawback i can see from that is that when the list item text wraps, it wraps right back underneath the marker (and your text isnt all nicely aligned left).
Re: [WSG] Form fields in navbar causing IE to expand size of bar
On Wednesday, Aug 18, 2004, at 10:18 Australia/Sydney, [EMAIL PROTECTED] wrote: However, putting in the form field into my global nav div cause the brown bar (especially in IE) to become quite wide and not look right. I do recall reading somewhere some time ago that the form tag causes some issues with IE. Helen, it's not so much the form tag as the various form elements that you use within it. The visual display of form elements like buttons, dropdown menus, text fields etc is generated by the operating system, not the browser, and as such are notoriously difficult to incorporate into tight layouts. I see that you have styled the elements with CSS, but the support for that styling is patchy across browsers - especially as regards size (of text fields). I've sent you some screenshots of your navbar offlist to show differences in the way the elements render across browsers. Note some browsers don't render the CSS styling for from elements at all... I notice that if the browser is narrower than about 800px, the form elements wrap below the nav links - which is not a good look. It's a good idea to design your layout to allow for the different looks and sizes that different OSs will give you. HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] Unaccessible - NY Attorney General busts two big name sites
On Sunday, Aug 22, 2004, at 09:48 Australia/Sydney, Michael Kear wrote: I was interested that the Australian Human Rights and Equal Opportunity Commission uses tables for layout in their web site at: http://www.hreoc.gov.au/disability_rights/index.html http://www.hreoc.gov.au/disability_rights/faq/f.a.q.html Cheers Mike Kear It's going to be interesting to see, over the coming months (years?), what happens with legislated accessibility here in Australia. I found out, in my limited experience in coding new content for Govt departments, how far away the majority of Govt sites are from being either accessible or Standards compliant. There was a specs document supplied with the brief, referring to W3C, WAI, etc, but the exisiting site I added to was a *long* way short of the specs... Seems like some pretty shoddy lip service being paid to the whole concept, really. It was obvious the original developers had coded for IE/Win, and not tested elsewhere... I pointed this out in the tech handover of my additions, but nothing's been done - and that was almost a year ago. Still, it's been gratifying to see posts to this list by people around the country who are working on Government sites, using standards for new versions. Keep it up, guys. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] Div-based design example
On Tuesday, Aug 24, 2004, at 14:27 Australia/Sydney, John Horner wrote: What would members recommend? Does this design, for instance, require relative, not absolute positioning? I haven't closely checked the the CSS, but in principal, yes - absolutely (umm... yuh.). I think your friend needs to study up on the theory of document flow. JZ's DWWS is a good start. Absolute positioning is absolute, but relative to something else - in this case the browser window. If there's a containing div within which the absolutely positioned div is placed, its actual position on the screen will change if the containing div is resized - say by text zoom. CSS-P design must allow for the expansion downwards of layout elements on the page as their contents are resized. Clear as mud? Thought so. Personally, along with floats, I found abs v rel positioning one of the trickier concepts to get a handle on. Stick with it... it becomes clearer after a while. HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] Absolute positioning vs floats
On Wednesday, Aug 25, 2004, at 18:49 Australia/Sydney, Mike Foskett wrote: Have you considered the documents appearance on a 160px wide PDA? How about a Braille reader? Surely you wouldn't deliver the layout CSS to either of these devices... semantically structured text and (for the PDA) minimal relevant images only - ? Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] Can someone help me figure out some semantic mark-up, please?
On Friday, Aug 27, 2004, at 18:20 Australia/Sydney, Seona Bellamy wrote: I know this sounds like a lot of extraneous steps, but it is on the Admin side of the site and it to allow them to easily administer a list of something like 50,000 line items without having to scroll forever or keep going to different pages - the idea with this script is that the page loads with all of the data, but most of it is hidden. I agree with Manuel and Mordechai about the approach for structuring the code - but I'll be *really* interested to see how big the final file is, with 50,000 line entries! Something tells me that's going to be quite an initial wait for it to load... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] CSS - select list
On Friday, Aug 27, 2004, at 15:37 Australia/Sydney, Zaac Woodhead wrote: Is it possible to apply css to a select drop down/multiple select list. Have a design on my desk with a fully formatted selectl list - including the arrows, etc. Iknow it does not meet standards, but is this possbile? Zaac Woodhead Phone :1300 855 095 Website Design Development www.portplus.com | www.pretendre.com | www.virtualtours.com.au Beware of inconsistent browser support for CSS styling on form elements - including select dropdowns. Form elements are system-generated graphics, and vary considerably from browser to browser - as does CSS support, from good to zero. Test, test, test. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] Can someone help me figure out some semantic mark-up, please?
On Sunday, Aug 29, 2004, at 09:09 Australia/Sydney, Seona Bellamy wrote: Well, I've found a way around the problem (used an incrementing counter instead of the ID-number from the database, so each item has a unique ID) so this question isn't exactly pressing any more. I'd still love to know the answer though, if for no other reason than that there's a good chance I'll use this script again in future and it would be nice to know in advance if text-ID's are workable. Seona, depending on the doctype you're using, ID's that are just numbers won't validate. They need to start with an alpha character - for XHTML 1 Strict, at least. But there again, if your project is for offline use, maybe validation doesn't matter... ;o) N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] Sliding doors and Mac IE5.2
On Sunday, Aug 29, 2004, at 17:08 Australia/Sydney, Kim Kruse wrote: I'm using the ALA tab menu (sliding doors) as my main nav. Now I've been told that it breaks in Mac/IE5 into something like this... left tab img - the link - right tab img. Is it possible to get it right in Mac/IE5.2? Hi Kim Your menu looks just the same in IE5.2.2/Mac as it does in Safari or Firefox. I've sent you a screenshot offlist to see, as there's one little layout anomaly in IE you should see... BTW, I've used the Sliding Doors tabs on a site I built too, and I noticed that IE - both Mac and Win - doesn't support the image change on hover - although the 'on' state is highlighted OK, and the text link changes colour OK. I've given up trying to work out why, and put it down to 'graceful degradation'. Anyone else got any clues? HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] background image on a horizontal list.
Hi Lennart - welcome. Your buttons are only visible for the width of the word used for your links, plus its padding - so a bigger (wider) word reveals more of your button. Try this: #navlist li { list-style: none; margin: 4px; float: left; } #navlist li a { display: block; ...etc } That way the button is always fully visible - but if your linked text is longer than 100px, it will extend outside of the button... By the way, I noticed you tried to 'open up' your buttons with spaces in the code: lia href=#About/a/li That won't work; the browser ignores whitespace. Adding non-breaking spaces (nbsp;) would work, but it's not the best way to fix the problem! Oh, and your English is fine - better than my Norewgian (which is zero)! Hope that helps. Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Wednesday, Sep 1, 2004, at 18:56 Australia/Sydney, Lennart Fylling wrote: Hello there!! I've been a member here for some time, and now I will see if I as well can get some help from you :) First of all, I'm a beginner so don't shoot me!! The problem: On my webpage, I've created an unordered horizontal list for my main navigation, where I use some homemade buttons as background (link, visited,hover active). I've made those buttons 100px wide, but in the browsers I've tested them out the hole background image is not visual . It's a horizontal list, so I have used :{ display: inline; width: 100px;} in the css, but the {with: 100px;} declaration, doesn't seem to have any effect at all. When I use {display:block; width: 100px; } it does'nt seem to be a problem (other then the list transform in to a vertical list). Here is the layout: http://lennart-fylling.com Here you can see how the buttons really look's like: http://lennart-fylling.com/utkast2.php I hope here are some experts in this area, who can make may day much better. I hope you understand both my problem and my school english :) -- Lennart Fylling Aalesund Norway http://lennart-fylling.com ** 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 ** ** 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] Can I use frames AND css?
On Friday, Sep 24, 2004, at 10:40 Australia/Sydney, Daniela Meleo wrote: NOW, the client has decided that after handover he will need the ability to easily add new pages whenever he needs to (as additional topics not yet know become required.) He's an open source techie type and will hand code the pages, so an authoring tool won't be used. He wants me to change the site so that it uses frames. Daniela: Uh... raher than try and make the frames work, I strongly suggest you use max effort to convince/persuade/educate your client that frames simply aren't the way to go. I used to use frames extensively in my site designs; I discovered the hard way that they're a PAIN to maintain - especially if you end up with nested framesets, as I did once or twice! Since I started coding to Standards, my life is SO much easier. One file: one page. Maintenance is a breeze, and Search Engines love it. All things considered, the only advantage I ever really found with frames is that some bits of the site can remain static while other bits scroll - fine for paranoid clients who ALWAYS want their logo visible, but otherwise... Really, I understand the perceived (and maybe actual) saving in bandwidth by not duplicating (say) navigation code in single pages, but if you code with clean, lean (X)HTML, not only will your bandwidth overhead be reasonable (also taking advantage of caching) enough to serve your site as single pages, but your client, if he's got enough knowledge of code to do his own additions anyway, will find well structured code easy to edit. A few well-placed comments would help - although semantic markup of divs etc will as well. Just my 2.5c, but hth Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] help with fixed positioning in IE
On 12 Oct 2004, at 1:27 PM, Focas, Grant wrote: I've solved the Mac scrollbar problem. http://www.homebass.info/fixedPosTest/ Now the only issue left (besides that it uses CSS hacks) is that the back to top link only takes you to the top of the content div minus the height of the header. Grant Try adding an id to your body tag and linking to that instead of the named anchor. Also, your DOCTYPE is incomplete - it should include a URL for the DTD to which it refers... HTH N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] help with fixed positioning in IE
On 12 Oct 2004, at 2:55 PM, Focas, Grant wrote: Using a body id will not work because the top of the page is alsways in view. It is the top of the content div which is hidden. Well, in that case I've misunderstood what you're trying to do with the link. In all my Mac browsers (IE5.2, Safari 1.2, Netscape 7.2, Firefox 0.9) the link 'resets' the page to the way it looks when it frist loads - which is what I always have my 'top' links do... - ? N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] DL Formatting Issue (IE again!)
On 12 Oct 2004, at 11:57 PM, Golding, Antony wrote: In Firefox, Opera, etc the layout appears perfectly as required. In IE6 however, below the final image some of the dd definition is repeated. At present, the final dd contains '21/09/2004 at 13:05:02' and beneath that, '5:02' appears. The '5:02' text isn't repeated anywhere in the source, and seems to come purely from the final dd text. Any suggestions why would be gratefully accepted! Try this: http://www.positioniseverything.net/explorer/dup-characters.html HTH - N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Div Away The Day
Chris Kennon wrote: The four programs across have started a chain of DIVS that seem more cumbersome than table cells. How would one recommend recreating this in semantically correct CSS, without the tangled mess of DIVS I've birthed. Chris, before anything else, you have a fundamental error in your CSS that you should correct: you can't have both an id and a class with the same name (i.e. #high2, .high2). This is going to cause conflicts you can do without. NB also that div#high1, #high2 {...} is not the same as div#high1, div#high2 {...} The first means 'apply this set of style rules to the div with id high1, and any other element with id high2'. If you want the rule to apply to div#high1 and div#high2, you have to list them in their complete form as multiple selectors. As far as the semantic of the markup goes, I'll repeat what's been posted here often: if data looks like it should be presented in a table, use a table. Just make sure you use table summary, thead, etc, to ensure accessibility. There again, I don't have a problem with your example divs, in principle. With the correct use of classes (or indeed descendant selectors), you have the hooks in the markup to be able to change your layout in ways from minor presentation tweaks to page layout revisions, without touching the markup at all. My 2c. N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] CSS TAB MENU - A new version with problems
Genau Junior wrote: Can anyone explain me why this browser freezes, when the mouse sets over the css menu tab? PS: My css file still no validated and some classes are repeated, but on final version, that will be fixed. Rule #1 for problem-solving: eliminate variables. In this case: validate your CSS. You can't expect browsers to work in any kind of predictable way if your CSS is invalid. I haven't checked, but I suspect your duplicate classes won't help. N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Div Away The Day
On 13 Oct 2004, at 11:43 AM, Chris Kennon wrote: Can you point me to this section in the w3.org specification. I'm not doubting your expertise, but I'm confused why a class and id cannot have the same name. On Tuesday, October 12, 2004, at 04:01 PM, Nick Gleitzman wrote: Chris, before anything else, you have a fundamental error in your CSS that you should correct: you can't have both an id and a class with the same name (i.e. #high2, .high2). This is going to cause conflicts you can do without. Uh - no, not with the schedule I've got today - but rather let me rephrase my previous statement: You shouldn't have both an id and a class with the same name; this is going to cause confusion you can do without. I had a conflict occur in one version of a browser when doing just this, in a build I did some time ago - sorry, don't remebeer the specifics, I just remember learning (the hard way, it seemed like, after hours of testing) that this wasn't a good idea. Having said that, it was almost certainly an older browser version, so these days it may not be such a problem. It's just something I now instinctively don't do; it makes site edits down the track that much easier. But hey, whatever works for you... N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] CSS Validation query
On 13 Oct 2004, at 6:13 PM, Jackie Reid wrote: Hi everyone im a bit confused here - trying to validate my css and i get this warning Line : 0 font-family: You are encouraged to offer a generic family as a last alternative what do they mean... i always do that and get the no errors or warnings reply... whats going on.. ? Jackie www.jobfitsystem.com/about.asp www.jobfitsystem.com/styles/jobfit2.css Don't know about Line 0 - but I found this in your CSS: #info ul {font-family: verdana ,Arial,Helvetica,Sans Serif; font-size: 0.9em; line-height: 1.1em;} Try sans-serif instead of two words, and see how you go... N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Print styles for IE - Document too wide
On 15 Oct 2004, at 9:31 AM, Mark Stanton wrote: Yeah everything is as low as it can go. Considering each column has a minimum of 1 character+padding+margins I cant see any possibility of all 80 columns fitting on 1 A4 page I don't expect it to, but it would be nice if IE would allow stuff that slips off the page horizontally to come out on a new page (like excel does), rather than just cutting it off. Can't resist this, seeing as how it's normally one of the whipping boys of this list: IE5/Mac will do just that. N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] my site works on Mac, not PC :: suggestions???
On 16 Oct 2004, at 3:13 PM, Shane Helm wrote: I'm not sure where I've gone wrong, but I must get a PC to check from now on. Must go shopping. Oh no, will I actually own a PC. Dreadful... Just teasing you PC folks. :) I'm with you, Shane - I'd never use anything but a Mac as my main development machine. And swore fervently that I'd never own a PC. But as a developer, I accept that (a) I have to check my builds cross-platform, and (b) Microsoft get it wrong. My solution? Virtual PC. It's a boon, and not that expensive. The program is US$129, or US$249 including WinXPPro. The great thing is, once installed, you can run multiple PCs - so I have Win98, Win2K, and XP 'machines' - all right on my Mac. Cheap, cheap investment for effective testing. Never thought I'd be promoting MS software, but there ya go. See http://www.microsoft.com/mac/ for a tour/demo. I know this is drifting OT - apologies. So no replies here, please. If you (or anyone) wants to know more about the PC-on-Mac experience, email me direct. N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Appreciate browser check, please
On 18 Oct 2004, at 12:33 AM, Jorge Laranjo wrote: Looks good in Safari 1.2.3 (v 125.9) in the Mac OS X. In Attach i send you a Shoot of that look... Jorge - please, no attachments to this list. 100KB+ for a message is too big. If you would like to help out with screenshots, send them off-list to the person concerned. Thanks - Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] shrinking p whitespace
On Tuesday, Sep 28, 2004, at 20:29 Australia/Sydney, Rick Faaberg wrote: At here: http://www.lucernemedia.com/ I'm trying to shrink the whitespace after the video titles (.video_title is the relevant style I'm pretty sure). See anything obvious that's keeping the whitespace so big after the titles? Rick: First, by 'whitespace' do you mean the line of space between p.video_title and p.video_synop? Is that what you're trying to close up? Because if so, you need to add margin-bottom:0 to the css declaration for p.video-title, and margin-top: 0 to p.video_synop. A p, by default , will always give you a line of whitespace before the next p... Or is your issue something else? If so, browser, version, platform, please - and a clear description of where the unwanted whitespace is? Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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] heading background continues across container width
Uh - no... the point is that the markup doesn't change *regardless* of what you do with it the css. Separation of content and presentation - right? That's how come we can use ul's for horiz navbars, vertical buttons, or whatever. Neerav, in any case... What if you leave the Hx as block elements, but use no-repeat instead? I think it's your repeat-x that's causing the problem... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Saturday, Oct 2, 2004, at 18:43 Australia/Sydney, Clayton Lengel-Zigich wrote: Hi, first time poster... anyway. I think most would agree that forcing Hx elements to become inline elements, rather than block level elements, is a poor use of the markup. In other words, semantically it's probably not the best idea. Technically you could take an unordered list and style it so that it looks like a paragraph, but then what's the point of using an unordered list, right? On Sat, 02 Oct 2004 16:16:43 +1000, Neerav [EMAIL PROTECTED] wrote: Hi Im experimenting with some techniques from dan cederholms book Web Standards Solutions and found that setting a background image like so h1 , h2 , h3 , h4 , h5 { text-align : left; padding-bottom: 14px; background: url(/img/under_heading.gif) repeat-x bottom; } caused the background image to continue across the whole container div width, my guess is that this occurs because Hx tags are BLOCK elements, so I added : display: inline; Which seemed to fix the problem, and made the background display only below the text in Hx tags, Are there any caveats to bear in mind when forcing Hx tags to be inline ? -- Neerav Bhatt http://www.bhatt.id.au Web Development IT consultancy Mobile: +61 (0)403 8000 27 http://www.bhatt.id.au/blog/ - Ramblings Thoughts http://www.bookcrossing.com/mybookshelf/neerav ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** -- Clayton Lengel-Zigich http://www.lengelzigich.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 ** ** 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] heading background continues across container width
On Saturday, Oct 2, 2004, at 19:32 Australia/Sydney, russ - maxdesign wrote: That does not take into account headings of different character length. From what I understand, the underline must be under the content only, no matter how long the content is. Oh, OK - the bg image is being tiled, right? Hence repeat-x... I was coming at it from the other way, where I've used a full-width image, which is 'cropped' by the length of the Hx. So, going back to your previous post, Russ, using {display:inline} *would* work - but you'd have to add a clear to the Hx as well... Neerav, I agree, it's likely to come back and bite you. It's this kind of thing that always makes me ask, 'Is this a good/necessary/site-enhancing/information-clarifying design decision?' N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] css syntax question
I've never seen such 'nesting' listed anywhere in any CSS how-to info, and I presume that (a) if it were possible, the technique would have been published, and (b) it hasn't been published because it doesn't work. Having said that, I haven't ever tested it, so I don't know for sure... What you can do, though, is group selectors that have common declarations into one rule: #nav p, #nav #tabs, #nav ul { property1: value-x ; property2: value-y ; property3: value-z ;} and then add additional rules for declarations that are specific to individual IDs/classes (or which override the declarations in the grouped rule - the Cascade in CSS means that a later rule takes precedence over an earlier one): #nav p { property4: value-a ; } #nav #tabs { property2: value-b ; } /* overrides property2: value-y above */ #nav ul li a { property5: value-c ; } ...etc HTH... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ On Sunday, Oct 3, 2004, at 09:33 Australia/Sydney, Brian Duchek wrote: Is there a syntax in CSS declarations which 'wraps' classes/ids in a parent condition? I'm not asking this very clearly, but the idea is similar to the Javascript syntax... with { ... } The purpose being, I find myself writing a lot of statements like the below #navigation p {...} #navigation #tabs {...} #navigation #tabs ul li a {...} Isn't there an easier/more efficient way to apply the parent selector #navigation to all the different groups? #navigation { p {...} #tabs{...} } Does anyone know if the above works, or if it has any browser support holes? I only ask because I know the people on this list can chew up this question and spit it out like no one else :-) Thanks, -- Brian Duchek =-=-=-=-=-=-=-= e: [EMAIL PROTECTED] w: new.inquiline.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 ** ** 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 tags for FAQs
On Monday, Oct 4, 2004, at 10:31 Australia/Sydney, Andreas Boehmer wrote: I am in the process of creating a FAQ section in one of my websites and I was wondering what would be the best tags to use for the questions/answers? Perhaps there is no standard, but I was wondering whether a definition (DT, DD) would be applicable? Doesn't really sound right to me, but it would be nice to use specific tags to easily identify questions and answers on a FAQ page, don't you think? Thanks for the feedback! Andreas. I've just done exactly that with a FAQ page. Makes styling the page a breeze, and is semantically applicable. If you search the archives over the last month or so, there was a thread discussing use of dl for any dialogue-type 2-part content: interview, qa, term descripton/definition, etc. N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] OL or UL? It´s rigth?
On Tuesday, Oct 5, 2004, at 05:33 Australia/Sydney, Manuel González Noriega wrote: Genau Junior wrote: Hello, My friend is asking me if i can use tags ul ol/ol /ul No. Make it ul li ol liLong live lists!/li /ol /ul Close, but no cigar. Make that ul liI love nested lists! ol liBut close that li tag!/li /ol /li /ul N ;-) ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] OL or UL? It´s rigth?
On Tuesday, Oct 5, 2004, at 10:19 Australia/Sydney, Parker Torrence wrote: Yes you can http://www.w3.org/TR/html4/struct/lists.html section 10.2 see DEPRECATED EXAMPLE: ~parker OK, maybe so... but deprecated means it's not a good idea to use it (just because it 'works' doesn't mean you should). Whether you're using HTML4 or XHTML, it's simply a good idea to close all tags. This is what's known as 'well-formed markup' - and is definitely best practice. N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Semantically creating 'pipes' for footer links
I have to say I'd use an extra class on the first li over that big chunk o' Javascript any day. Apart from the extra code, what if I have Javascript disabled? My 2c... N ___ Omnivision. Websight. http://www.omnivision.com.au/ On Tuesday, Oct 5, 2004, at 13:55 Australia/Sydney, Richard Czeiger wrote: Thanks for the feedback guys but the problem persists ! :o) While Neerav's solution puts pipes before the first and after the last - I am trying to get rid of these so that it looks like this: link | link | link | link and NOT | link | link | link | link | see? Ben's solution requires a separate class attached to the first list item. Again - this is kind of clunky when you're trying to work with the best possible form of an inherited cascade. That's why I used the JavaScript to kill the first LI in each UL in the footer - at least until the pseudo class firstChild is implemented by browsers. Also the Taming Lists article looses it's styling for IE 5 and above (same with the Practical CSS Layout Tips article). Anyone else? Richard :o) ** 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] Semantics vs Light Code
On Tuesday, Oct 5, 2004, at 14:50 Australia/Sydney, Luke Moulton wrote: So on one hand there's smaller file sizes, uncomplicated CSS (with fewer hacks) but imperfect semantics, and on the other there's perfect semantics bloated CSS with a few hacks thrown in for good measure. Where does one draw the line? opinion I think it's interesting to see the attention being paid to lean code as part of the embracing of the Standards ethic, and the discussions on same, here and elsewhere. If you code to the best practices that Standards espouses, your bloat will be vastly reduced - if not eliminated - as a matter of course. I started building sites using HTML (...2? 3?) way back when, learning as I went from JZ's Ask Doctor Web series. In those days, even the great man himself was advocating tables, spacer gifs, frames et al. No-one ever paid attention to the amount of code bloat they were generating - apart from trying to keep a total page size under 100KB (!). No-one knew any better. Now we do. The resources available, both in print and online, for start-up developers are amazing. The support of groups like this is amazing. What I can do with CSS these days is - amazing. But I think we should all keep one very clear objective in mind. The aim of the game is not to see how little code, how few bytes, we can use to build our sites. The aim is to communicate a message to an audience. Most of my clients neither know nor care how the code works. They are concerned, however, that their message reaches their target audience, and that hopefully that audience responds to the message in some way. So the line should be drawn at the point where a site's content is accessible by everyone for whom it's supposed to be accessible. The accessibilty gurus on this list is to define that as anyone who can access the medium - with whatever technology they use. And that makes sense (and is, let's face it, just courteous); if you're going to publish to a global audience, why wouldn't you use whatever means you have at your disposal to reach them all? A practical approach is to code for an intended audience. It's up to you to define that audience - whether the entire population of the planet, or a subset thereof that you choose - and code accordingly. If you have to 'bloat' your code - either with additional markup in the name of semantics (totally wrong use of the word, btw, but that's another story...) or with additional CSS to take care of buggy browser support - then do it, if it means your message reaches the audience. If you want to keep it bare bones, then do that. Your shout just won't be quite so loud. /opinion Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] LI VS Tables - A Tabular data fight
On Tuesday, Oct 5, 2004, at 22:31 Australia/Sydney, Genau Junior wrote: I Would like to know about your oppinion for using tabular data with DIV> LI> or to use table> to show them. I´ve been researching on the web about this discussion but i didn´t found an answer really straight. I am rebuilding a website using XHTML, that will work with many tabular data and i have some doubts about to use div/lists easily and semanticly correct. I would like to know, if some developed a website that uses tabular data without tables and what was the experience using them. Soon as possible i will publish my work using li>/li> to show how i did that. Hugs, Genau Lopes Júnior WebDesigner ¬¬¬ http://www.meucarronovo.com.br (new site under construction) See the thread 'Table-style admin layouts' that's been running for the past 24 hours... N ___ Omnivision. Websight. http://www.omnivision.com.au/
Re: [WSG] IE5 Mac factors
On Wednesday, Oct 6, 2004, at 03:26 Australia/Sydney, Ted Drake wrote: I visit all of the sites and read all of the blogs about css design. I've seen the use of filters and hacks to make IE5 mac work. But I'm looking for a place to see what IE5 mac does differently. Do you know of a good resource for IE5 Mac issues? Ted, you should also Bookmark Phillipe Wittenberg's excellent and extensive resource at http://www.l-c-n.com/IE5tests/ N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] hidden list background issues, etc.
Lorenzo wrote: URL: http://196.36.166.35/tower CSS: http://196.36.166.35/tower/s/tower.css CSS: http://196.36.166.35/tower/s/navDropdown.css 1. In IE6, the border/background of the top list in the #steps layer appears hidden. Is there a way to fix this? 2. There's also a major gap on the left of the list that I can't seem to get rid of - any suggestions there would be much appreciated. 3. In Opera7, the dropdown menu is showing some nasty vertical spaces - any idea why and how I would go about removing them? 4. Layout in IE5/Mac is horribly broken - horiz navbar renders as vertical, and your floats are breaking the layout. 5. js dropdowns in Safari 1.0 render in the wrong place - relative to 0,0 (I think) - in any case, unusable. Sorry, it's late and I'm too shattered to figure fixes for so many problems. Suggest you try Phillipe's IE bug resource at http://www.l-c-n.com/IE5tests/ for the Mac issues, and Big John's http://www.positioniseverything.net/ for the IE6... Oh, apart from this quick one: for the space to the left of the list, try {padding:0}. FYI and HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] top of page link class not taking effect
On Friday, Oct 8, 2004, at 23:37 Australia/Sydney, Richard Lake wrote: I've added a top of page link as follows: div class=topla href=#headerTop of page/a/div and related CSS, as follows: .topl { float: right; font-size: .75em;} a.topl { color: #660; text-decoration: none;} Everything validates (apart from an IE expression that I've removed but made no difference) yet the topl style is ignored and the enclosing div's style is retained. It can be viewed at http://127.0.0.1/pricklypair/index.php Can anybody help please. Thanks Richard Sure. You don't have a a of class .topl in your code, so the CSS doesn't work. Try .topl a { color: #660 ; text-decoration: none ; } ...which means that all links within an enclosing element of class .topl will be styled. HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Help. 2 extra words breaks the page
Paul, your CSS doesn't validate. This is failing: div.sidebar {border-left: 1px solid #ccc; width: 200px; float: right; padding-left: 5px; padding-vertical-align:text-top;} Error: Property padding-vertical-align doesn't exist : text-top Remember to validate! The problem with IE5 lies with your tables. If you strip out the tables, the problem goes away. In particular, the table that you have ID'd by summary=content. It has no declared width that I can see, in either markup or CSS - and in IE5 it's expanding to fit the available content, which puts its RH edge outside your layout box. Add a border to this table to see what it's doing. Try laying out the page without the tables - it may seem more difficult, but trust me, you'll get better control in the long run. HTH N ___ Omnivision. Websight. http://www.omnivision.com.au/ On Saturday, Oct 9, 2004, at 04:05 Australia/Sydney, Paul Burchfield wrote: Argh! It wasn't until early this morning that I remembered that I'd forgotten to mention that this seems to be specific to IE/Mac v5. Here are links to screenshots: http://www.love2tap.com/sidebar/fits.jpg http://www.love2tap.com/sidebar/bad.jpg -Paul B. On Oct 7, 2004, at 6:00 PM, Paul Burchfield wrote: I'm trying to create a sidebar for web pages at work to allow an author a spot to place notes or other quick thoughts. What I've found is that the amount of text in the sidebar paragraph can break the page. At some point an extra t words causes all of the text on the page to go beyond the right hand boundary of the page. It's easier to see than explain. A version that works can be found at: http://www.love2tap.com/sidebar/fits.html And a version that doesn't work can be seen at: http://www.love2tap.com/sidebar/bad.html The only difference is the addition of the words justo nec to the sodebar paragraph. Can anyone help me figure out what I'm doing wrong? If it helps, the CSS I'm using is at: http://www.love2tap.com/sidebar/css/asto_0404.css Thanks. -Paul B. ** 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] Validator error
On 18 Oct 2004, at 6:05 AM, Mordechai Peller wrote: Let me start by saying that I have enough experience with syntax checker to know that the error message doesn't always point to the right place and that one error can generate many messages. But that being said, I think this one takes the cake. The DOCTYPE was set to XHTML 1.0 STRICT and the page had an image missing an alt attribute on line 68 so of course it didn't validate. But instead of just a Line 68, column 104: required attribute alt not specified, I got eight more errors, five before and three after, all reference to non-SGML character. Fix the missing alt error and everything else validates. What's going on? I don't have an answer, but can I add to the question? I get 'non-SGML character' warnings (NB warnings, not errors) when I use, say, #38; instead of amp; to escape an ampersand. Which syntax fpr character entities is correct? Or does it depend on the charset specified in the Content-Type? I understand that #38; is Unicode, but I always (well, usually) specify iso-8859-1. Is this why I'm getting these warnings? Should I stick to the alpha-based entity descriptions for iso-8859-1? Thx - N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [SPAM] Re: [WSG] CSS - How the max size of a .css file
John Wells wrote: Which begs the question, when a stylesheet is loaded up by a browser, will that browser automatically attempt to load every referenced image, regardless of it being called by the HTML file? This question's come up before - and the answer is... (of course) it varies from browser to browser! Test, test, test. N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] site layout problems, specifically in Mac IE
On 22 Oct 2004, at 12:17 AM, Craig Millman wrote: This is my first post, I have been silently gobbling up info. I have designed a website for a friend www.pacifichomeloans.com.au which seems to look ok in IE on Windows, however not in Mac IE. The css is at www.pacifichomeloans.com.au/styleshome.css I have validated the XHTML although it has given me a warning. However it won't validate the css for me, because it says I need to validate the XHTML. I am a little confused there. I am new to css and I am sure I have made some mistakes however I can't figure it out. I only have IE on my computer and have downloaded images from browser cam to test on other browsers. After reading all messages posted on this list, I also realise if it is working in IE Win and not in IE Mac then the css is probably wrong!! Hi Craig, and welcome. The CSS validator says 'Line 48, Column 20 - The content of elements must consist of well-formed character data or markup.' I think it's seeing the character in your javascript at that point and reading it as the start of a tag that isn't closed - therefore the error. Try using this syntax to declare your javascript: script type=text/javascript!--//--![CDATA[//!-- ...javascript here... //--!]]/script or else remove your javascript to an external file and import it with script type='text/javascript' src='filename.js'/script BTW - the crossfade effect that the javascript is driving doesn't work at all on Mac browsers - although the slideshow does. Caption's a little off in IE Mac - there's a line and a half of height for single line captions, so you can always see a bit of the 'and hire purchase' line below the other two captions... As far as the overall layout presentation goes, I recommend you develop to Firefox and then tweak for IE on both platforms. Your layout is broken to some extent on all Mac browsers - Firefox, Safari, IE. It's always best to develop to a compliant browser first, then add the IE tweaks/hacks. HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Combining in css
On 22 Oct 2004, at 9:59 AM, Lyn Patterson wrote: #[name of page] #container #floatimgleft {background-color: #dff;} but it didn't work. Only the last mentioned (#floatimgleft) worked and (#container) reverted to general background color. Is there a way to combine them - have I left out commas or something? Yes - what you've done above is create a specific selector for #floatimgleft in #container in #[name of page] - so the bg color will *only* apply to #floatimgleft. To combine them you need to separate them with commas, but each selector needs to be written out in full: #[name of page] #container, #[name of page] #floatimgleft {background-color: #dff;} HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] select as form label
On 22 Oct 2004, at 10:15 AM, Nick Lo wrote: p label class=blank for=input_phone_1 select name=input_phone_1_type id=input_phone_1_type option value=Please Select/option option value=work selected=selectedwork/option option value=homehome/option option value=faxfax/option option value=mobilemobile/option option value=otherother/option /select /label br / input type=text name=input_phone_1 id=input_phone_1 value= /p ...is currently in the admin section of a CMS I'm putting together. The point is to allow the admin user to specify what the type of phone is as well as input the number itself. In the admin section the accessibility issues are obviously less crucial as I generally know who is using it, etc. However, this feature is useful for forms on the front-end of the site where issues of semantic correctness, accessibility are important. So my question is really; is the label around a select element essentially pointless? Well, no... but it needs to be used correctly. The label element allows the text label for a form input to become 'live' (ie clickable) to enlarge the target for, say, a radio button - but it needs to wrap around the element it refers to. You have the label for id=input_phone_1 wrapped around id=input_phone_1_type - so it's neither effective nor semantically correct where you have it. (I'm sure Patrick can give you a clearer answer...) Also, you have option value=work selected=selected - your option 'Please Select' won't be visible until the user opens the dropdown... HTH Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Semantic indentation
Joshua Street wrote: What's the recommended practice with indentation? Uh - is there any reason not to use pre? What you're talking about is really visual presentation, isn't it? I'd respectfully suggest that the indentation is not adding anything to the semantics of the content or the code. A screen reader, for instance, is not going to deliver the indented lines any differently to the non-indented ones, surely? It's more likely to adjust the delivery according to the punctuation (or lack thereof) at the end of the lines - which is as it should be... N (2c) ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Broken In Safari/IE Mac
On 26 Oct 2004, at 9:37 AM, Natalie Buxton wrote: Despite what I say on my site, I do not hate mac users, I am merely envious of them. Who doesn't want such a pretty and fast machine? Mmm. Maybe '...asking you rich bastards...' rather than 'telling' might get you a little more sympathetic response? Maybe 'begging'? 'Imploring'? ;) N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Broken In Safari/IE Mac
On 26 Oct 2004, at 9:37 AM, Natalie Buxton wrote: Woe is me. It's busted big time. And for the life of me I cannot work out which CSS rules Safari and IE Mac are refusing to honour. Two things: In IE the navigation bar is sitting wrong. In Safari it's the entire layout is busted big time. Natalie, I found that changing #container {background-position: 41px top;} to #container {background-position: top center;} fixed the banner in Safari 1.2.2, FF0.9.1, IE5.2.3 on Mac and appears good in IE6Win. I have to say I think IE's rendering of your page is worse than Safari's - although you may be looking at Safari v1/1.1? Check out Phillipe's excellent repository of MacIE Oddities at http://www.l-c-n.com/IE5tests/ - if you haven't already - although I know it's hard to test if you don't have one... I need sleep before I can tackle IEMac, sorry... N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] A little CSS question
On 29 Oct 2004, at 11:03 AM, Indranil Dasgupta wrote: But my XHTML validation says something weird about the ul tags. Can you say what I need. XHTML Validation is showing 5 errors only. 3 of them can be fixed by adding 'alt' attributes to these files: img src=http://troidus.com/wp-images/who.png; / img src=http://troidus.com/wp-images/blogroll.png; / img src=http://troidus.com/wp-images/other.png; / The other two can be fixed by fixing the proper nesting of your tags. You have p ul li/li /ul /p ...which you can't do. Close the p before starting the ul: p/p ul li/li /ul ...and you should be fine. HTH - Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] A little CSS question
On 29 Oct 2004, at 6:07 PM, Indranil Dasgupta wrote: Another question, is there a float:middle or center? No. Use {margin:auto} for left right; whatever you need for top bottom. Be aware that auto vertical centering is one of the few things that CSS won't do. Try a Google search on 'CSS vertical center' for lots of tips on how to do it. N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Firebird / Mozilla
On 2 Nov 2004, at 11:38 PM, Sam Hutchinson wrote: Hi all, Fairly new here and been monitoring list for a day or so, all very useful stuff. Anyway, i'm having a bit of trouble with hanging images - my right image hangs into the footer on Mozilla - any ideas? http://www.sammyco.co.uk/pages/solutions/default.html Page validates as xhtml css, and works ok everywhere else but still looks slightly odd in Moz Cheers Sam --- - SAM[MY]CO » CREATIVE DESIGN SOLUTIONS » website [re]launch november 04 http://www.sammyco.co.uk/ ...let's fix the web ! Sam, my guess from checking out your page quickly in several browsers is that you're developing for IE - instead of working to a compliant browser and *then* tweaking/hacking for IE. You say 'works ok everywhere else', but it doesn't; IE6/Win is the *only* browser that I've got that your layout is good in. Firefox, Safari, Opera, Netscape, Mozilla on Mac all show the 'hanging image' problem; IE/Mac is totally busted (if you care) - the biggirl image is sitting over the top of your content! Validation's not enough - use a compliant browser to test, then make it work in IE's busted rendering. As to the problem itself: It's the -5px margin you have on #topright_sub. margin: 0 fixes it in all my browsers (except IE). Negative margins will always give you headaches - don't use them as a positional hack. The problem's almost always something else. The main problem with IEMac is the float:left on #topright_sub - float:right works, and makes more sense in the layout anyway. Personally, I don't think you need to float both #topleft and #topright - give #topleft a margin-right of 330px to make room for the image in #topright_sub, and just float it - to the right. (BTW, beware of underscores in id names. Some browsers don't like them, and ignore the rule altogether.) Also - there's a *big* delay in the page load - I think it's all that javascript? Oh, and can you post here using plain text messages, please? N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Firebird / Mozilla
On 2 Nov 2004, at 11:38 PM, Sam Hutchinson wrote: Hi all, Fairly new here and been monitoring list for a day or so, all very useful stuff. Anyway, i'm having a bit of trouble with hanging images - my right image hangs into the footer on Mozilla - any ideas? http://www.sammyco.co.uk/pages/solutions/default.html Page validates as xhtml css, and works ok everywhere else but still looks slightly odd in Moz Cheers Sam --- - SAM[MY]CO » CREATIVE DESIGN SOLUTIONS » website [re]launch november 04 http://www.sammyco.co.uk/ ...let's fix the web ! Just noticed something about Sam's javascript - he's using a chunk of code to display a rotating message in the status bar - and in Firefox, even when I have another site loaded in a new tab, Sam's contact details are still happily rotating right there at the bottom of the screen. Not very friendly - kind of hijacks the second site... Comments? (or not, if it's OT) N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Firebird / Mozilla
On 3 Nov 2004, at 9:34 AM, Kevin Futter wrote: I've noticed this about Firefox too - it appears that the status bar belongs to the parent window, and child tabs open in the same window will inherit any status bar wrangling that is applied to that window. IMHO this is a minor flaw in the way Firefox uses the status bar, as it should be relative to the current tab, not the 'containing' window. Do any other tabbed or Gecko-based browsers exhibit this behaviour? Safari doesn't (1.2.2) Mozilla does (1.7) Netscape does (7.2) (all on Mac) N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] MSIE 5.2 Mac problem
On 6 Nov 2004, at 11:15 PM, Marco van Hylckama Vlieg wrote: Hello folks, I have created a new personal site about 1.5 weeks ago. My pages are valid XHTML and they display fine in MSIE 5.5-6 on PC, Safari, Opera, Firefox but MSIE 5.2 on MacOS X cuts off the page at the bottom. I have no idea why this is. Is there anyone who can have a look and give me some insights? The site I'm talking about is in my signature. Best regards, Marco -- Marco van Hylckama Vlieg Senior Internet Developer email: [EMAIL PROTECTED] www: http://www.i-marco.nl/ IE5/Mac doesn't like the {height:100%;} you have assigned to div#main. It appears to be interpreting that rule as '100% of the height of the viewport when the page first loads'. Remove it and all is well - but haven't checked how its absence affects all the othet browsers... HTH N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Confirming Java Script tag
On 7 Nov 2004, at 9:26 AM, The Man With His Guide Dog At The Tent Store wrote: script language=Javascript type=text/javascript src=AccessKeyJavaScript.js/script Yup, that's fine - for HTML4. You might, however, like to look at standardising your tags in lower case - you currently have a mix of upper and lower, and while this won't cause problems with your HTML 4.01 Transitional DOCTYPE, if you ever want to 'upgrade' to XHTML, you'll need to change all your tags to lower case. Save yourself the work later, and do it now... HTH N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Persistent page indicator (page id) when you have two lists of navigation
On 10 Nov 2004, at 3:31 PM, [EMAIL PROTECTED] wrote: I have given each page a body id and each list item in DIV sidebar an id as well but it breaks when I use the following: I will be creating different templates for the two areas Staff and Students so am not concerned about that list. body#studenthome li#studenthome a, body#studentsaccess li#access a{ border-right: 12px solid #000; { Without even looking at your page, I can tell you that you have two elements here - body and li - both with the same ID. An ID needs to be unique on a page, or it *will* break something. Change one of the IDs to something else and things should improve. HTH N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **