Here are some challenges and solutions for some of my client's web sites:
- Client: DIVERSANT. A page that should look like this:
Looked fine in all browsers except IE 9. In IE 9 some of the text was not visible:
- This is a bug in IE9, that sometimes places text behind the background image. Normally, browsers are competent at placing text in front of the background, but if you Google IE9 z-index bug you'll see that problems have been reported by others as well. So, to workaround this bug in IE9, I gave the div and paragraph tag for this text a z-index of 1000, to force it into a higher layer than the background image.
- Client: High5 Ballooning: I received a call from the client, that none of the Flash banners were appearing. Where the banners should be, the screen is blank. I went to the site and encountered the same problem.
- Client: High5 Ballooning. I inherited a site that contains tables and legacy code. One page had a font that was too small at the bottom of the page, but the other pages had the correct size font:
- The page with the incorrect font needed the following code change for the first line in the center section body content area, to be like the other pages:
<td valign="top" bgcolor="white" width="649">
<td class="bodytext" valign="top" bgcolor="white" width="649">
If the site is at some point re-written, a template should be used, so that code for sections such as this is consistent across all pages, and only needs to be maintained in one place.
- Client: High5 Ballooning. The solid white background of a table-based page was broken, with the blue background showing through:
- The cause was white space after an img tag but before the end td tag. It wasn't obvious that this white space was there, because word wrap was putting the end td tag on the next line. In this illustration I turned off word wrap so that you can easily see the white space:
Back to top
- Client: High5 Ballooning. The alignment of an item in the bottom section was too far too the left, and not centered like I wanted. This was only happening in IE, not Firefox, Safari, or Chrome.
- A photo immediately before the bottom section, that was floated right, was affecting the alignment, because the float had not been correctly cleared in the bottom section:
Last modified: 10/3/2012 7:30 PM