Firefox 3 makes links of form headings

A very weird issue appeared in Firefox 3 just now (on both PC and Mac), but not in Safari or Chrome on Mac or IE6 on PC.

I had a validation error regarding the a part of my header code concerning the logo on the site. I’ve tried to make the logo into a link and in so doing I’ve encountered trouble in various browsers, esp. IE6 which adds lots of space under the image which pushes the main content of the page down.

Anyway, the error complained about my a href tag which was as follows:

<a href="<?php echo get_settings('home');?>/" title="Back to start page" ><img src="wp-content/themes/f8-lite/images/sig_invert.png" alt="Philipus signature" class="sigalignlefttop"</img></a><span class="description"><?php bloginfo('description'); ?></span>
<div class="clear"></div>

The suggestion was that I should selfclose it. So I did that as follows and removed the end tag:

<a href="<?php echo get_settings('home');?>/" title="Back to start page" /><img src="wp-content/themes/f8-lite/images/sig_invert.png" alt="Philipus signature" class="sigalignlefttop"</img><span class="description"><?php bloginfo('description'); ?></span>

The weird thing is that after this change (which cured the error) Firefox 3 has made every heading in my form on the contact page into a link back to the start page.

Looking in Firebug’s HTML view, I see that every “ol” and “li” has become populated with the URL to the front page and the alt text “Back to the start page”.

I am thinking has to do with a conditional tag I have in header.php for the contact page. The tag is:

<?php
if(is_page('contact')) :
echo '<style type="text/css" media="screen">
.container-inner {
	width:950px;height:769px;margin:0 auto;border:1px solid #000;background:white url('.get_bloginfo('template_url').'/images/marasunsetbgr.jpg) left top no-repeat;}
.post {
margin:265px 0 0 420px; }
</style>';
endif;
?>

Could that be it? If so, why does this only show up in FF3? And what have I done wrong?

Thanks for any insight
/p