Overlapping Backgrounds


Wow, the default Moveable Type 2.63 CSS stylesheet is horrible. I discovered why Internet Explorer 6 is coughing up a lung and other major organs: because every <div> on this page had a background. Some places on the page had three white backgrounds layered on top of each other. It’s definitely another Internet Explorer bug, but it’s generally something a good CSS stylesheet doesn’t do anyway. I took out every background but the one on <body> and that seems to fix the problem.

So why did the Moveable Type development team do it? My guess is so that CSS newbies would know where to change the background colour of the individual elements. Sure that’s all well and good and helpful but it really screws the default rendering. The default template should be rock solid and something that people can depend on. There are people out there that won’t even touch their templates — and the administrator can configure Moveable Type to have users/bloggers that can’t change their templates at all. D’oh!

If there are any other weird browser problems with this site please let me know.

Update on April 26th, 2003 12:15pm: The overlapping backgrounds was causing the page to render with large white blocks in it, covering text. If you went to another area of the page and came back, the text might be fixed. Or you could highlight the area where the text should be and it would appear.

I’ve made a mirror of this index page with the default “clean” stylesheet that is provided with Moveable Type 2.63 so people can try it out for themselves. If you’re wondering why that page doesn’t fit on your screen laterally, it’s because of this problem.

Update on April 26th, 2003 12:45pm: I can’t get that IE background problem to reproduce on the mirror page with the original templates. I’m stumped. I had a half dozen different people with this problem on my site. I’ll try to track it down … sorry about the inconvenience.

Nevertheless, the rather serious absolute div problem with the original style sheets I mentioned earlier is still present. This is a combination of bad CSS and IE 6 not being too forgiving (or maybe too literal). That’s very unlike IE considering some of the malformed HTML it renders