Got a new iPhone yesterday.

Tried several times to download the new iPhone SDK -- can't get it.

Running IE8 - I love what they did to the zoom feature, but other than that it pretty much barfs on every web page anywhere.

I recently built a webpart that, among other things, displays an image, but the webpart really only generates the html to reference an image and it could not easily guarantee that the image would be available and I wanted to show something better than a red x.

By using a little script on the 'onerror' attribute for the img tag, I was able to reference a "image not available" picture in case the image failed to load.

Here's an example:

<img src="maybethisworks.jpg" onerror="this.src='/notavailable.gif';" />

That's it. It works on Opera9.5, Firefox2, IE7, Navigator9, and Safari3.

Edit: I felt panic when I noticed that all my images where coming up with the not available picture. After some flail I finally realized what was going on. The images were in a checked-out state which means that if I was authenticated they would appear, but if I was anonymous, they wouldn't and I would get the onerror behavior.

BTW: For anyone needing to perform check-in on many files (which is what you get after you upload a directory of images to a image library) you can use the "Manage Site Content and Structure" feature of MOSS which will allow you to do a mass check in.

Yes, yes, I hear you anti-table zealots, but this is cool. (I'll have to blog my thoughts about this someday, along with the other religious argument about nothing but stored procedures accessible to code.)

Scenario: You have a table that will have n columns, where n is determined at run time and you want the columns to have equal width, for example, a table that is 100px wide with 4 columns should render 25px wide columns, 5 wide, 20px.

Why is this useful? SharePoint or ASP.NET SitePath menus.

Here's how:

table tr td { width:5%; }

When the table renders and sums up the 5%s and gets only 20 or 25% total, it scales that up to be 100% and the cell width percentage scales up with it.

see it at http://hafthor.com/equalwidthtables.html

I haven't tested this non-quirks mode, but it does work in FireFox and IE7.

[Edit 2007-11-04] I have tested this in xhtml strict mode (IE7 and FireFox) - it still works.

see it at http://hafthor.com/tricks.html

[Edit 2007-11-05] Dang. FireFox doesn't render this the way I wanted when in xhtml strict mode. The issue wasn't apparent until the overall width wasn't really wide. But, I tried those pages on iPhone Safari and they looked okay.

The first blog entry I made, initially, had a float clear problem. DasBlog apparently doesn't clear floats from the HTML entry contents in the crazy manner needed to appease the IE quirks gods. See http://www.positioniseverything.net/easyclearing.html.

The problem should be evident on this page:

http://hafthor.com/floatclear.htm

scroll down far enough on IE and you should see the text of the article disappear. This appears to happen because the align=right img floats lower than text. If you don't see that behavior, the image at the end of this article shows the effect. After posting the original article, I moved the image up to avoid this problem. But I wanted to see if I could fix it. Maybe...

http://hafthor.com/floatclear2.htm

I simply added this to the theme.css

.itemBodyStyle:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.itemBodyStyle {display: inline-block;}

/* Hides from IE-mac \*/
* html .itemBodyStyle {height: 1%;}
.itemBodyStyle {display: block;}
/* End hide from IE-mac */

and got rid of the <div style="clear:both;" /> business from the itemTemplate.blogtemplate.

If this works right, I shouldn't have the float problem on this post.

Edit: Yes, but it doesn't work quite right when shown in RSS Bandit.

Edit: But if I place a <div style="clear:both" /> at the end of the blog article html, it shows up correctly. Hmmm...