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，我已经尝试删除其他格式以查看是否导致问题。它是否存在并不重要。以下是行动中的小提琴：http://jsfiddle.net/#&togetherjs=R7hj7mcuFU

Answer 1

目前看起来并不太糟糕，但为了进一步增强它，你可以在你正在使用的社交网络图像的左侧或右侧添加填充。

要显示白色背景，请移除＆＃34; position：absolute＆＃34;来自你的CSS。

添加徽标时，导航栏无法正确呈现

1 个答案: