修复元素的位置

时间:2016-01-10 15:41:19

标签: jquery html css html5 css3

我的元素位置几乎没有问题。我希望在徽标图像后显示右侧的导航,但不幸的是它的工作不正确。在下面你可以看到我现在拥有的东西。我该如何解决?我尝试使用float:右边菜单,但它没有帮助。

image processing to improve tesseract OCR accuracy

HTML标记

       <header>
            <section class="section section--menu" id="Juno">
                <img id="logo" src="img/logo.png" height="150px" width="150px">

                <nav class="menu menu--juno">
                    <ul class="menu__list">
                        <li class="menu__item menu__item--current"><a href="#" class="menu__link">Home</a></li>
                        <li class="menu__item"><a href="#" class="menu__link">News</a></li>
                        <li class="menu__item"><a href="#" class="menu__link">FAQ</a></li>
                        <li class="menu__item"><a href="#" class="menu__link">Contact us</a></li>
                    </ul>
                </nav>
            </section>
        </header>

CSS

.menu {
    line-height: 1;
    float: right;
    margin-bottom: 15px;
}
#logo{
    margin-top:15px;
}
.section {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.section--menu {
    position: relative;
    overflow: hidden;
}

1 个答案:

答案 0 :(得分:0)

也许这样:

l=b