items inline

[chrismoore]

Hi,
my site is www.chrismooreimages.com. On my homepage, I have three items in the footer (search, map, guestbook) and they are lined up vertically as originally I coded them as separate <div>s. I would like to preview what they look like lined up horizontally between my keywords box and feedburner. I tried to follow a similar outline as designing a navbar. This is the code I came up with, but it's not working. Any help would be appreciated.

in Footer:

<div id="footcontainer">
<ul>
<li><a href="http://www.chrismooreimages.com/map"><img src="http://chrismooreimages.smugmug.com/photos/369517362_JJAPG-Ti.jpg" height="90"width="125"></a><p>Let Me Show You the World</li>
<li><a href="http://chrismooreimages.smugmug.com/gallery/5943241_ynhYR"><img src="http://chrismooreimages.smugmug.com/photos/370611962_NhqbB-Ti.jpg"></a><p>Search My Site</li>
<li><a href="http://chrismooreimages.smugmug.com/gallery/5943244_hqhbR"><img src="http://chrismooreimages.smugmug.com/photos/370753941_B3kBf-Ti.jpg"></a><p>Sign My Guestbook</li>
</ul>
</div>

in CSS
#footcontainer ul li a {
text-decoration: none;
padding: .2em 1em;
color: #9e793e;
background-color: #000000;
font-family: Trajan Pro;
font-size: 115%;
}

#footcontainer ul {
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

#footcontainer ul li {
display: inline;
}

Thanks,
Chris