Sidebar 2 borked, amongst other things
I’ve been making minor changes to the layout over the past week and although I’ve been anal in keeping chronologically organised backups, the thought of going through each one trying to find the problem has me running from the room screaming “Hold the sauce Napolean”.
I’ve started by running a validation check. Cue the wailing and gnashing of teeth. From 0 to 41 errors in one several easy steps. I’ll start by fixing those plus the css validator issues but if anyone wants to chip in with how to make the right hand sidebar (sidebar 2) come back up to the top in Internet Explorer, I’d be mighty grateful.
March 14th, 2006 14:59
You backup and validate when you are doing design changes? Cool… me, I just lose everything and then start again from scratch. I like the stress.
Surely it’s just a width thing in the css file?
March 14th, 2006 15:03
Actually, that’s the problem, I’ve *not* been validating and not checking in IE. Now I’m catching up with all those errors. And for some reason, the css validator thinks I don’t have a doctype. So somewhere along the line the header.php file isn’t being read. Maybe.
As for the width suggestion (thank you), I’ve tried reducing it and no dice. Hang on, maybe one of the pictures…
But first, the validation!
March 14th, 2006 16:15
It’s not going to help with the sidebar, but I think a line feed at the start of the technorati tags plugin might remove a few of the errors.
March 14th, 2006 20:44
A quick test on an XP box I’ve got sitting around here suggests that altering the right padding of both sidebar and sidebar2 from 27px to 25px fixes the problem in IE.
You have to be careful when specifying both a right/left padding width and an overall explicit width for an element. IE has a broken box model that causes it to handle widths slightly different to other browsers, creating odd discrepancies like this.
It’s sometimes better to create the desired effect using two div elements. Give the first div an explicit width, but a margin and padding of 0px. Then stick the other div inside it without an explicit width, but possesing a margin of the desired size. This creates the same effect without encountering the IE box model problem. Unfortunately it does involve superfluous extra markup, but it’s one way around the problem.
March 14th, 2006 21:59
I know nothing about solutions to your techie probs, so instead I’ll politely ask: what the heck does “Hold the sauce Napolean” mean? And why does one from the room when saying it?
March 14th, 2006 22:44
Richard, thank you! I’ve a splitting headache right now, the minute it’s gone I’ll give that a go.
ally bean, I hate to ‘fess up but those words just fell off my fingers as I wrote in a panic at seeing all those errors. Shall we put it down to stress-induced poetic license? :-)
March 14th, 2006 22:53
Two minutes and a handful of Ibuprofen later… Richard, you are my hero! Just made those changes, checked it in IE and bingo, it’s fixed.
*wanders off singing that Bonnie Tyler/Hero song from the 80s*
March 15th, 2006 16:24
lol daisy. stress-induced poetic license sounds good to me.