On the page http://tesselaar.com/gallery/ I have a heading (level 1) at the top of the page "Photo Gallery" that doesn't display in IE7 and I can't work out why.
It follows the same CSS and page-structure as the rest of the site, the only difference being there is an element being floated to the right immediately after.
Any insight would be appreciated.
It certainly appears glitchy to me, but with only IE dev tools installed here I can say it isn't the HTML in itself, it's definitely an IE CSS bug. One of the many many things IE is twitchy about is float, so on that basis I suggest you try two things.
The first is to change the doctype to strict - it's a more solid base to go forward from and will change the way IE behaves. Might fix it in itself.
The second suggestion is to remove the float and width from the div and instead rely on the text-align: right; you have applied to the form. That would give you the same layout as appears in FF now without the use of float. However it appearsthat what you might be trying to achieve is a floating dropdown directly next and right of the header? If you want to keep a centered header that's going to be pretty messy tbh.
I suspect that the issue was to do with floats and italicized content. IE hates having italicized content wrapping around floats.
I suspect that as you were tightening up some other css you put some overflow hidden in there and inadvertently fixed two problems...
Here's a nice little article about it: http://www.positioniseverything.net/explorer/italicbug-ie.html