HTML changes... CSS guru needed

Please excuse a technical note… I made a few tweaks to the site today to try and handle a few glitches that had been pointed out to me. The basic font size had been measured in pixels, something I’d never done on a site before. I now remember why I hadn’t done this: Internet Explorer on Windows doesn’t allow the user to resize a page’s text if its size has been set in pixels. So it’s now set in ems. This may make the default text size look larger or smaller for you — if it’s completely unreadable let me know your browser and operating system.

I’ve also tidied things up a bit for those using versions of Netscape 4.x. It’s not pretty, but at least it’s readable! One problem though… I’ve managed to make the form for adding Annotations appear, but it still doesn’t work. The div below the textarea is mostly being displayed behind the textarea, rather than below it. This hides some text and on the Preview page the buttons don’t work. If you know CSS and can work out how to shift the text following the textarea down, do let me know! I was using Netscape 4.7 on Windows XP.

Comments

• N Todd Bernhardt on Mon 20 Jan 2003, 09:57pm

  Using IE6 on Win2k, with text size set to “smaller,” the text is pretty unreadable. Knocking up the text size to “medium” makes the text display about the same as it was (11 or 12 px, mebbe?) before you converted to ems. It’s no big deal from my perspective … it’s easy enough for me to change (holding down the Ctrl key and using my mouse’s scroll wheel does it), and I’m sure you have the greater good of accessibility in mind when you decided not to lock down the text size.

  FWIW (I’m no CSS expert … I don’t even play one on TV), my experience looking at the pages with Netscape 4.76 (again, on a Win2k machine) gives the same results that you describe above. Sorry I can’t help.

• N Phil on Mon 20 Jan 2003, 10:51pm

  Thanks Todd. As long as the text looks OK with IE’s text size set to “medium,” the default, that’s good. The default font size was previously 13 pixels by the way, now it’s 0.9em.

• N francois on Tue 21 Jan 2003, 04:33pm

  Well done with updating the CSS to relative units. Everything looks fine in IE6/Win98.

  Regarding the NN4 problem, my advice would be to hide *all* your styles from it. @import the lot. This site’s about the content, after all, and as far as I can tell from the source it’ll all remain perfectly accessible.

  If you are determined to squash that bug, though, I recommend you ask on the css-discuss list:
  http://www.css-discuss.org/mailman/listinfo/css-d

• N Phil on Tue 21 Jan 2003, 04:42pm

  Thanks for the suggestions. Hiding all the stylesheets from NS4 could be the answer, as it doesn’t look too bad that way. I’ll resort to that if I don’t fix the problem soon. I’ll check out the css-discuss list too - thanks.

• N Nick on Wed 22 Jan 2003, 11:26am

  I don’t think NS supports div tags, this may be the cause of your problem.

• N Phil on Wed 22 Jan 2003, 12:08pm

  Netscape 4.x does support div tags.

• N Phil on Wed 22 Jan 2003, 02:05pm

  I’ve fixed the problem, after a great deal of trial and error, removing lines of CSS until things worked. Netscape was getting things muddled up because of line-heights in some elements of the page, so I’ve moved these to the stylesheet Netscape can’t see. Phew.

• N celeste on Wed 22 Jan 2003, 02:24pm

  Thanks Todd, I never realized I could change text size so easily, browsing is now so much simpler.
  Thanks for creating this site Phil, also thanks to all the knowedgable people doing the annotating. I’m learning so much.

• N Todd Bernhardt on Wed 22 Jan 2003, 03:48pm

  Happy to help where I can, Celeste! I don’t have the history chops of the other folks on the site, so I try to add value where I can…

  BTW, the Ctrl key/scroll wheel tip above only works with IE. To quickly resize text in Netscape (in 4.x, anyway), hold down the Ctrl key and use the left bracket ( [ ) to make things smaller, and the right ( ] ) bracket to make things bigger.

  And I’ll gladly add my voice to the chorus of huzzahs for Phil and the other annotators … you rawk!

• N Michael Cutillo on Fri 31 Jan 2003, 05:53am

  Looks alright on Mac OSX with Mozilla 1.3a, everything is a little small on Safari, and IE:MAC 5.2 is perfect.