如果不移动导航菜单,则无法将标识放在左上角



我正在与一个学校项目合作,并尝试重新制作一个网站。有没有人知道如何在不移动导航菜单的情况下将我的 EA 徽标放在左上角?这是 html:

    <html>
<head>
    <link rel = "stylesheet" type = "text/css" href = "css/style.css">
    <title>FIFA 16</title>
    <meta charset="utf-8">
</head>
<body>
    <div class="nav">
        <div class="ealogo"><img src="img/ealogo.png" alt="ealogo"</div>
        <a href="index.htm" target="_self" class="fifafont">FIFA</a>
        <a href="" target="_self">ULTIMATE TEAM&trade;</a>
        <a href="" target="_self">NYHETER</a>
        <a href="" target="_self">MER</a>
        <a href="" target="_self">KÖP</a>
    </div>
</body>
</html>

Css:

    body {
margin: 0;
padding: 0;
background-color: #fff;
}
    .nav {
padding: 15px;
text-align: center;
font-family: lato;
font-size: 20px;
color: white;
background-color: black;
width: 100%;
}
    a {
text-decoration: none;
color: white;
margin: 25px;
}
    .fifafont {
font-family: fifawelcome;
font-size: 30px;
}

我所做的只是给徽标一个 id 并向左浮动,并带有边距以更正填充,使其位于左上角。

#ealogo{
    margin-left: -25px;
    margin-top: -15px;
    float: left;
}

JSFiddle

最新更新