Debugging the Borders

Sadly, this is not a gardening post and has nothing to do with insects or plants…though you’d be forgiven for thinking it was.

It’s actually a learning-web-development skills post and one which is really just a rant to say “CCS….what the?!”

See…for those of you that don’t know, the appearance of most of the web pages you see is controlled by little files called “cascading style sheets” – CSS for short.  These little bits of code say things like:

“That table has a 3 pixel border and a blue background”


“That text over there is green and bold and extra small”

or even:

“That thing over there should be in a box 200 pixels wide, 100 tall, with a picture as a backgound and it should be offset by 50 pixels from the top of the page”

And it should be really simple, but you know what.  I’ve written high-integrity, safety-critical software for aircraft.  I wrote the basics of a Window-based GUI in Pascal when at college (well…sort of).  I know languages that are procedural and functional, imperative and declarative.  I’ve written everything from assembler to Prolog.  I have a degree in computer science from a highly respectable university.  (note: if you want to employ me then leave a comment and I’ll get back to you! 😉 )

But nothing…NOTHING I’ve ever come across is as unpredictable, complicated, difficult to get right, and downright confusing as this CSS stuff.

I’ve spent quite a while now trying to work out how to get a table to look just like it should.  I think the final solution was “border-collapse: collapse”, but man, it was tough to find.

I take my hat off to those web developers that actually understand this.  Pray tell…how did you learn to write proper CSS-based web pages???  Self teaching doesn’t seem to be an option.  Or do you have a good book?