Question

我正在尝试将徽标的中心设置为我最后一个媒体查询目标屏幕，低于479像素。我遇到了麻烦。每次我有自动边距时，浏览器都会将img推向右侧。这就是我到目前为止所拥有的。任何帮助将不胜感激。

HTML

<div class="wrapper">
    <header>
        <div id="logo">
            <img src="images/Bliss_FinalLogo_2.png" alt="Logo" />
        </div>
    </header>

CSS

@media only screen and (max-width: 479px){

    li.main_nav {
        float:none;
        width:100%;
    }

    .learn_info {
        width:100%;
    }

    nav {
        margin: 0 auto;
        background: none;
        border:none;
    }

    #logo{
        display: block;
        margin-left:auto;
        margin-right:auto;
    }

    a{
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px
    }

}

Answer 1

您需要指定#logo的宽度。如果您不想这样做，则可以为text-align:center设置header。

http://jsfiddle.net/6kWfU/

中心div在标题内

1 个答案: