html - 添加 Logo 时导航栏无法正确呈现

Question

我似乎遇到了一些奇怪的 css 问题，我无法让我的导航正确呈现。Facebook 和 Twitter 部分相互冲突，我不确定我可以在 CSS 中的哪个位置对其进行编辑。

CSS:

ul
{
list-style:none;
list-style-type:none;
}

li
{
list-style:none;
list-style-type:none;
 float:left;
}

a
{
 font-family: Verdana;
 display: block;
 width: 100px;
 height: 40px;
 padding: 10px;
 text-align: center;
 color: #036;
 text-decoration: none;
}

a:hover
{
color: #55a1c8;
}

HTML:

<ul><li><a href=Purchase.html id="current">Purchase The Book</a></li>
                    <li><a href=About.html>About The Characters</a></li>
                    <li><a href=Games.html>Games</a></li>
                    <li><a href=LoggedIn.html>Log In</a></li>
                    <li><a href=https://www.facebook.com/AmazingAdventuresSeries target="_blank"><img src="http://www.irscstudentweb.org/~S14006548/images/logos-and-badges_f-logo_online/png/FB-f-Logo__blue_29.png" alt="Find us on Facebook"></a></li>
                    <li><a href=twitter.com/neesyboowookus target="_blank"><img src="http://www.irscstudentweb.org/~S14006548/images/Twitter_follow.png" alt="Follow us on Twitter" height=29px></a></li>
        </ul>

还有一些其他 CSS，我已尝试删除其他格式以查看它是否会导致问题。它是否存在并不重要。这是一个可以看到的 fiddle :http://jsfiddle.net/#&togetherjs=R7hj7mcuFU

Answer 1

目前看起来还不错，但要进一步增强它，您可以在您正在使用的社交网络图像的左侧或右侧添加填充。

要显示白色背景，请从您的 CSS 中删除“position: absolute”。