css - 标题内的中心 div

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/