Blogger CSS

I'm trying to integrate Blogger into my existing site, but I'm having some trouble with one aspect of the CSS. Specifically, in my main template (http://www.howtomeetbroads.com), I've got a horizontal row of buttons at the top. In my Blogger template (http://www.howtomeetbroads.com/updates.html), though, I can't seem to get those same buttons to display horizontally. They simply show up vertically in the upper left-hand corner. I feel like this is probably something simple in the CSS, but I can't seem to figure out how to fix it.

Additionally, in my main template, those buttons act as rollovers using javascript. But in the Blogger template, that doesn't work either.

Any help would be greatly appreciated.

Thanks!

I think the difference is because you have

img{display:block}

in updates.html, and you have a background image set for your buttons. I'd guess this is because updates.html is html strict rather than transitional , requiring the display:block statement.

However, I can't see an image at all behind the buttons, it just looks black to me, so why not just remove the image tage entirely? Alternatively use the image as the background image to the <a> tag.

If you have to have the image where it is in the code, then maybe give a try with

#buttons img{display:inline;vertical-align:bottom}

and see what that does.

That did it. You rock. Thanks for your help!