I've updated the blog's design to something a little more to my taste. I hope you like it, and would very much welcome comments!
I've been mucking about for a few hours with dasBlog themes, CSS2
and relevant technologies and learned a great deal. CSS2 is so damn
cool! Back in the day - what,
four years ago? - I used to have a bunch of perl scripts to do the
style/content seperation for me utilizing a bunch of macros. Nowadays
it's not only a great deal easier to seperate the content, CSS2 also
helpes you avoid a lot of HTML hacking and HTML bloat: no more hacking
tables where design elements go. It kicks ass!
That said, there are a few things that are nontrivial with CSS2. For
example, check out the blog title; notice how the horizontal line stops
next to the text. The border itself is easy enough (see next section
though), but it took me a little while to figure out how to make it
'stop'. Eventually I settled for the following hack:
- A <div> section acts a container for the entire blog title and contains two additional <div> sections
- Both sections have the exact same content. The first section
maintains the appropriate flow and layout for the page but is not
itself visible (it has style="visibility: hidden")
- The second section floats over the entire container (style="float: left")
- This is where it gets interesting. The lower part of the
second section must cover the lower border of the container; originally
I did this with a <br&rt; tag, but as I suspected this proved problematic when the client text size was changed. Eventually I settled for an additional padding-bottom: 2px; style for the second section, which solved the issue nicely.
- Finally we want the horizontal border to stop before it hits the text; the solution couldn't be simpler: just add padding-right: npx (in my case I used 5) and you're good to go.
Next stage is to find out how to gradient the border when it gets
close to the cell. Also, the whole thing might've been easier with a
table and a couple of columns, but not nearly as fun
Finally, I have to rant: Microsoft IE programmers are a bunch of
shitcocks. Even in standard-compliant mode (why in the hell do I have
to, as an author, worry about IE modes anyway? Why isn't it
standards-compliant to begin with?) the damn thing just doesn't process
CSS properly. In my case it turns out that dotted borders simply do not work
in Internet Explorer (except for Mac IE version 5.5 or something
bizarre of the sort); if you're reading this post using Internet
Explorer you're probably seeing a solid border around the post itself.
This is NOT the correct behavior. IE displays dashed borders instead of
dotted ones; this looked aweful, so I used a couple of hacks
to get IE to display solid borders instead. And this is just one of
myriad bugs. I wonder if they'll get fixed in IE7, but would advocate a
move to Firefox regardless.