html - 将标题文本放在导航栏旁边

Question

开始一个将用于教育目的的元素，因为它需要 html、css 和 php我仍在学习!我想知道如何定位我的 H4，使其与导航文本对齐。有更好的方法吗？ http://66.172.10.179/resolver/

CSS:

/* Body */
body {
    background-color: #FF5930;
}

/* Navigation bar */

header {
    background-color: #FF4719;
}

nav h2 a{
    color: black;
    text-decoration: none;
    display: inline;
    margin: 0;
}

nav h2 a:hover{
    color: gray;
    text-decoration: none;
}


nav ul li {
    display: inline;
    margin: 0;
}

HTML:

<header>
    <nav>
        <h2 class="header-text"><a href="index.php">Skype Resolver</a></h2>
        <ul>
            <li><a href="index.php">Resolver</a></li>
            <li><a href="blacklist.php">Blacklisting</a></li>
            <li><a href="purchase.php">Purchase API</a></li>
            <li><a href="dtools.php">Domain tools</a></li>
            <li><a href="stools.php">Spam tools</a></li>
            <li><a href="mtools.php">Misc tools</a></li>
        </ul>                           
    </nav>
</header>

Answer 1

试试这个:

将margin和padding添加到nav ul:

nav ul {
    margin:0;
    padding:0;
}

将 nav ul li 更改为:

nav ul li {
    display: inline;
}

JSFiddle Demo