Geek Help Wanted: The missing sidebar
Being a Mac user, I’m spoiled with Safari and Firefox, and happily assume that the rest of the world has it so good.
A kind reader wrote in to let me know that the sidebar isn’t showing up on Internet Explorer 6 or 7 for Windows. This means readers stuck with IE (at work, for example), aren’t seeing the search box, or any of the sections.
I’ve been willing to accept that the brad logo looks shitty on Windows (a .png issue). But lack of navigation?
This will not do.
I’ve poked around a bit, and tried the usual “make-it-validate” tricks, but haven’t cracked it. And I wouldn’t know if I did, since I don’t have a PC to test it on.
So if you’re a web-geeky reader with access to IE and some free time, and feel like pulling the source of this page to figure out why IE isn’t handling it as expected, I’d love to know. You’ll get a big shout-out from me, and good karma to boot.
UPDATE: A big thanks to Matthew Pennell and Andy for their suggestions. If you’re reading this on IE, please let me know if the changes so far have fixed the situation.
UPDATE #2: Here’s where we stand. Apparently, the sidebar now loads properly on IE 6 and 7 beta. I’ve set it so the brad logo doesn’t even show up on IE 6 (it was part of the problem), but appears normally on IE 7 beta.
Please let me know if this is not the case. And thanks to all of you for your help.
Articles
March 8th, 2006 at 1:22 pm
Off topic, but I thought you’d want to know. At TVGuide.com, there’s an interview with William Fichtner. You can take this off if it’s covered by copyright, but this is a question to him:
TVGuide.com: Which of your many films have you always felt got short shrift? Which one really deserves a second look on DVD?
Fichtner: Oh, “Go,” absolutely. “Go” is just such a great movie. Such a great movie. It’s so funny, so well made…. [Director] Doug Liman’s sensibilities are so perfectly twisted and in tune with that movie. Far be it from me to figure out how studios market movies, but I remember that at the time they were really pushing for a teen audience, but the people who really got “Go” were in their twenties, thirties, forties — everybody who remembered what it was like to be 18 and fearless. “Go” is a really, really good movie that never got its due. You’ve got to check it out.
March 8th, 2006 at 2:08 pm
John,
I tried to post a solution for you, but I guess it was filtered out… I emailed it to your ‘ask’ address [since I couldn't find another].
I also know how to solve the PNG transparency issue for IE and make it look reasonable - email me!
March 8th, 2006 at 2:23 pm
Hi John,
Your problem is due to the #container DIV being floated and the #rightside DIV being absolutely positioned - IE has a problem with absolute children elements of floated blocks.
To fix:
1) Get rid of the float on the #container:
container {
/* float removed… float: left; */ background: #f4f2ea; border-left: solid 3px #000; border-right: solid 3px #000; border-bottom: solid 12px #000033; position: relative; }
2) Hide the image from IE, as it is expanding the height of the header to enclose the floated image:
/* Hide the image */ * html #pageHeader img { display: none !important; }
3) Take out the right margin from the #main DIV - as you’re using a fixed width, you know what the width will be so you can just use that:
main {
/* Take out the right margin and add a width… margin-right: 210px; */ width: 550px; text-align: left; }
4) Add a fake min-height for IE (which doesn’t understand min-height):
/* Min-height for IE */ * html #main { height: 600px; margin-right: 0px; }
And it all should work perfectly. :)
March 8th, 2006 at 2:24 pm
Hmm - your comment form tried to apply a bit of formatting; hopefully you can still make sense of all the code. :)
March 8th, 2006 at 2:55 pm
I can see the sidebar but not the brad logo in IE on my computer. I’m using XP Home system.
March 8th, 2006 at 3:08 pm
In case no one else has let you know John, the side bar is now working. I was lost without it!
March 8th, 2006 at 3:17 pm
All looks well in IE7 (beta), but in IE 6 the nav bar is there, but the brad is now AWOL.
March 8th, 2006 at 3:50 pm
Hi John,
Dooling suggested that I pop on by for a gander. Looks like some other smart people have helped you so far. Why give up on the brad on ie6? It is part of the look of your site. It is working fine in ie7 beta2. I’ll have to start another computer to have a look in ie6. I doubt you will have any problem getting it going in ie6.
Don http://htmlfixit.com
March 8th, 2006 at 4:04 pm
Interesting: you are not “broken” in ie6 … but you aren’t fixed either. I’ll get a minute and square you up. Your main page is actually “broken” but useable. Your comments page is not “broken” but is missing the best part of your look, the brad. I know that is currently intentional, but also not necessary. After dinner I’ll patch you up.
March 8th, 2006 at 4:05 pm
I’m on IE 5.5 for Windows here at work (curses to you Disney!). As with IE 6.0, the sidebar’s showing up just fine and the floating brad is gone.
March 8th, 2006 at 6:29 pm
I posted my answer/solution (shows as in moderation so only you and I see it). It now works WITH THE BRAD in ie6. That answer that is in moderation shows the code as all messed up. I’ll post the link here and make it my website (in the link above) for anyone who wants to have a look at it working.
http://bestfoot.com/temp/temp.html
You will have to also grab the gif image or make your own.
March 8th, 2006 at 7:39 pm
The site is working on my ie. I shun it and cringe when I have to use it because I’m so accustomed to firefoxes greatness.
March 9th, 2006 at 1:51 am
I can now see the links and search, etc - but I’m not getting the brad pic - I guess I must be on IE 6? It’s great to have the sidebar back! :-)
March 9th, 2006 at 2:47 am
Yeah, for IE 6 users, the brad logo is not there as John says, but the sidebar is back. (Eleanor, you can check what IE version you using at Help, Properties)
Thanks, John, thought you didn’t want us to visit the Artful Writer! ;)
March 9th, 2006 at 1:31 pm
I like FireFox, too, but you can’t assume it’s anywhere near the dominant browser. That distinction belongs to IE6 at the moment (60% of users, or more, see the W3 disclaimer), and not because people are “stuck with it.” For most, it’s all they know or want.
http://www.w3schools.com/browsers/browsers_stats.asp
As for Mac, it’s looking like about 3.6% of users, versus roughly 90% using some version of Windows.
A sad but true testament to the power of Microsoft’s marketing muscle.
rpd
March 10th, 2006 at 3:48 am
Help, About IE = yep, version 6. Thanks for that!
Last I heard my pc wasn’t overly compatible with Firefox - I’m on XP home, or I’d have decamped already. sigh :-)
March 10th, 2006 at 8:01 am
eleanor, the pc i’m using is xp and i’m fully foxed up. why wouldn’t it work on your pc? have you tried it, or is it that when you try to change over, a little dialogue box pops up from microsoft trying to scare you back into using their browser. if that’s what it is, ignore it. your pc will work fine with firefox, unless there’s something particularly odd about it.
March 10th, 2006 at 10:49 am
Eleanor,
I am the systems administrator for a household of three teenagers. We run XP pro, XP home, and NT. Firefox works great on all of them.
http://www.mozilla.com/firefox/
rd
March 10th, 2006 at 5:30 pm
The fix even works with IE5. Kuddos to the community!
March 18th, 2006 at 8:55 pm
So what gives John? I gave you the fix a couple of weeks ago … you are still broken in IE 6 (margins are off) and brad is still missing. Did you see the fix?
March 19th, 2006 at 2:45 pm
Don –
I can’t try the fix until I’m nearby a PC upon which to test it. I have your fix filed away until that opportunity arises.
March 31st, 2006 at 9:04 pm
This helpful collection of web design links popped up on digg.com
http://digg.com/design/75HelpfulWebDesignResources
http://www.cameronolthuis.com/2006/01/75-helpful-web-design-resources/
Might come in handy.
rd
April 4th, 2006 at 4:03 am
Dear John,
You wrote: “I’ve been willing to accept that the brad logo looks shitty on Windows (a .png issue).”, but i think You shouldn’t accept that! ;)
here’s a solution, a tiny javascript-based png-fix for IE: http://homepage.ntlworld.com/bobosola/index.htm
i hope You can fix the logo with it :)
bye, Deck
April 6th, 2006 at 3:44 am
hm, sorry for the double comment - it’s very strange: i’ve send the first comment with Opera 8.5 but it was only viewable if i checked it with Opera (with Firefox and IE the last post was still number 22!) so i decided to send again - thought it’s an Opera-bug -, but this time with Firefox and so that double-comment.
very strange indeed: with IE i’m still not able to see my posts!