移动元素,使边框顶部朝下,同时保留边框顶部



我有一个带有徽标和导航的垂直标题,用边框分隔。我想在将导航元素向下移动25像素的同时,将徽标和边框保持在原来的位置。我该如何做到这一点?

header {
    background: none;
    float: left;
    margin-top: 123px;
    margin-left: 22px;
    position: fixed;
    width: 158px; 
}
header logo {
    margin-top: ;
}
header nav {
    border-top: 1px solid #202020;
    margin-top: 25px;
    width: 158px;
}
header nav ul li {
    font-family: dalle;
    padding-left: 55px;
}
<header>
        <logo>
            <a href="#"><img src="img/logo.png" alt="whskytngfxtrt logo" height="139" width="158" /></a></li>
        </logo><!-- end logo -->
        <nav>
            <ul>
                <li id="blog"><a href="#">BLOG</a></li>
                <li id="work"><a href="#">WORK</a></li>
                <li id="about"><a href="#">ABOUT</a></li>
                <li id="contact"><a href="#">CONTACT</a></li>
            </ul>
        </nav><!-- end nav -->
    </header><!-- end header -->

只需将padding-top:25px添加到header nav:

header nav {
    border-top: 1px solid #202020;
    margin-top: 25px;
    width: 158px;
    padding-top:25px;
}

在css中添加:

header nav ul { margin-top:25px }

最新更新