Tuesday 22 November 2011

Misadventures with CSS

I've been spending the past week or so designing a new look for the Cent Hope website (watch that space, it's going to be BAZINGA, I tell you!). And since I haven't touched HTML properly for almost a decade, I've had to do a lot of reading on the web and research and some serious trial and error. And yesterday at 0:00 am I learned two important things:

  1. Browser incompatibilities with paddings/borders/width sizes are usually resolved with declaring the right Doctype. Me, I used: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">,
     which according to http://www.w3schools.com/TAGS/tag_doctype.asp , contains "all HTML elements and attributes, INCLUDING presentational and deprecated elements (like font). Framesets are not allowed."
  2. This particular doctype does NOT like spaces in between your width digits and the word "px". i.e. if you are declaring
    width: 50%;
    it doesn't bark at you, but as soon as you try
    width: 500 px;
    it just ignores you altogether. The fix is simple. Take the space away.
    width: 500px;
    and the world is a much better space.
I know this may be elementary to some, but I hope this is helpful for people out there who want fixed width DIVs and inadvertently left a space in between the numbers and the px and have spent a whole night trawling the net wondering why and finding out that actually most programmers don't like fixed widths and prefer to use percentages instead. (On that subject, while I completely understand the rationale behind leaving it flexi, I need a fixed width for this particular site. No offense).

And that's my contribution for today.


No comments:

Post a Comment