OK, it’s done. I’ve got a new design, which looks about the same as the old one, but is more consistent among different browsers. And, I’ve got a new name. I’m no longer “Steve Minutillo :: weblog”, instead I’m “messy-78″. I’m trying on the new name to see how it fits. Why? Why? Why?
There’s still a few annoying problems with the new design. I don’t feel like fixing the PHP code so it doesn’t put an <hr> before the first date, so I just cause it not to be displayed with the magic incantation HR:first-child { display: none; } Everywhere except IE/Win, that is. It doesn’t support first-child or adjacent style CSS selectors.
Also IE5/Mac (somehow I thought it was 5½ but it’s actually 5.22) is showing a horizontal scrollbar, for no scrutable reason. I think in the history of my site there is only one person to ever show up with that ridiculous browser and he’s me and I only did it as a test. What self respecting Mac type person isn’t running either Mozilla or Safari in this day and age?
Finally I’m facing the “CSS doesn’t let you make two columns that are the same height” problem. I want the yellow and coral-y colors to go all the way to the bottom of the browser window, no matter which column has more content. Back in the good old days we’d just use a <table> and probably even a bunch of 1px transparent GIFs. That’s the way it was, and we liked it. We LOVED it! I tell you, when we first did the liquid-stretchy new layout for Outpost it was chock full of tables and spacers and crazy secret techniques of hiding <form>s in between <tr>s so they wouldn’t break up the display. It was invalid to the very core, but it worked.
But not any more, oh no, <table>s are bad now. Valid markup is “cool”. So guess what, I used an onLoad JavaScript to peek and poke values into the DOM, to force the main content area to be at least as tall as the right column! (if the main content area is longer, it doesn’t matter, because the page background color is secretly that coral-y color.) Anyway. Not a particularly satisfying solution.
I keep trying to find other sites that maybe have solved it: a.whole just uses a <table>. a.swartz uses the incredibly dodgy display: table CSS style. a.ponderful looks like it might have the problem licked, until you see a page where the content is longer than the sidebar. Boom.
Enough raving. I’ve still got to do word of the day. So let me know if you see any anomalies. By the way, I’ve turned the style off completely for 4.0 grade browsers, so don’t be surprised if you get time-warped back to 1991.
Next project: Something that actually matters. Cool URIs.