Again, London

I’m visiting London for work again this week and the next. I left Boston Sunday night at 10 and arrived here Monday morning about 9:30. The flight was uneventful and uncrowded; the person sitting next to me shifted seats, giving us both more room. I am still unable to really sleep while flying; I found myself starting to drift off, then I would awake again with a jerk. This time, my luggage arrived with me, and I was able to get to the office without too much trouble.

I was pretty tired by the end of the day on Monday, as I hadn’t really slept since Sunday morning. I got to the apartment just before 5, talked to the rental agent, then went out in search of food and groceries. I explored the area a little, noted the Tube station close by, and St. Pauls in the distance, then picked up some breakfast food and some stuff for dinner.

The rental apartment is quite nice. It has a sitting room, small kitchen, bathroom and bedroom. The home owner is clearly interested in art; there are framed posters on all the walls, including the hallway. It does front on a busy street, though, so it is a little noisy.

Compared to home, sunset is very late here, because London is that much further north. I noticed last week sunset was still well before 8 at home; here, it’s around 8:45. (I imagine the days are shorter here in the winter). Since it was still light after supper, I went out for a little walk. I found I was just one block from where I stayed last fall, so the restaurants I found then are still handy. Finally, my tired legs could take no more, and I headed back to the apartment and into bed.

Last night, I decided to take a look at Trafalgar Square and Westminster after work. When I’d visited after work last fall, it was after nightfall; last night it was late afternoon. So I took the Tube to Embankment, walked up to Trafalgar Square, then up to Westminster, where you could barely see Big Ben due to all the scaffolding, over the Thames, and walked along the South Bank taking pictures, and ended up having a hamburger there. Afterwards, I came back here and edited the pictures.

Today’s been an uneventful day – I forgot to reset the alarm, so I was late getting up, and barely made a 9 AM video conference with one of the developers in Porto. I kept getting distracted from what I was supposed to be working on, but did scope out a major piece of work that we’ll be doing later, and helped out some. After having a nice BBQ chicken, I came back here, did some cleaning up, did some code review, and worked on this post. Hopefully, it will be done soon, and I can get to bed.

Subtle CSS Error

An exercise in debugging Cascading Style Sheets

We launched a new version of the work website this week. We’re still tweaking things, but overall, I like the look of it, especially the subpages. The report pages haven’t looked this good in ages. I think I’ve kind of fallen in love with Open Sans, the font used in the new design, and I like that it comes in both bold and semi bold versions.

Just before we launched, though, we ran into one of those wonderful head scratchers that seem to be the hallmark of web development. We were clicking through the various views, and Garry clicked into the screen to edit an address. In IE, (of course) there was nothing there except the Save button at the top of the page. Since the section is loaded via Ajax, my first thought was that it was some sort of problem with loader script, especially since I was seeing Javascript errors in the error console. I found that error, fixed it, but it still didn’t fix the page.

Brute Force Debugging

Obviously, since we were dealing with a new theme and a new style sheet, those could be the culprit. So was it the new HTML or the new CSS? Turning off CSS showed the form, but was that issue?  Nothing obvious leapt out at me, and I had no idea where to even start looking. Finally, I bit the bullet, saved a backup copy of the stylesheet, then deleted the last third of it. No luck. I reinstated the section I deleted, then deleted another section. Still no luck. Finally, removing lines 400 to 700 revealed the form. From there, it was a simple matter of removing smaller and smaller parts of the stylesheet, until we zeroed in on the offending line.

Here it is:

main .controlbar .minibutton, main .controlbar .minibuttonactive {width:auto; display:inline;  text-align:center;  margin: .07em 0 .34e7em}

Do you see it?

The problem arose out of the fact that, for accessibility’s sake, we’re using ems instead of pixels (px) as units of measurement, because they make it much easier for a user to resize their screen. Pixels tend to be simple integers; ems are often decimals, and in a longish decimal, a typo can hide. In this case, the margin should be

margin: .07em 0 .347em

Once I narrowed into the right line, it was immediately obvious. Nearly an hour to find, 10 seconds to fix.