In my attempts to convert the Engineering Council website (http://ec.uiuc.edu
) from coldfusion to PHP, I've also taken it upon myself to not use tables, and convert it over to pure CSS.
This, I find, is somewhat of a pain in the ass. While tables are clunky, and tend to uglify code, CSS isn't implemented in the same way for all browsers.
And that annoys me. Only ONE browser, out of the five I keep on my laptop, handles the div the way I want it to.
Here's what I'm trying to do:
See the rather ugly peach-colored navigation bar at the left? And how there's that extending empty chunk at the bottom (it extends, trust me; just try the program/events link.), 'cause it's based on a table, and that's the result of the table row-height extending?
I can't replicate that with CSS. I'm pretty sure I'm doing it right, but it only displays perfectly in OmniWeb, of ALL THINGS. Opera probably handles it correctly, but I have a bug elsewhere that's causing it to offshift a bit too far upwards.
Here's how I'm doing it:
<?php include "main.php"; ?>
/* Dummy wrap */
Essentially, the idea here is that, due to the fact that stuff is wrapped in the main-area-wrapper
, this will expand as far as there is text, thereby stretching the left-filler
so that it matches the height of the main
However, most browsers read the height:100% in the left-filler
incorrectly, and stretch that to 100% of the browser window
, which I DON'T want. XP
method (where you have a vertically repeating background).
None of those methods are particularly appealing... Why the fuck can't things be implemented correctly?!?