0

在 IE 和 Chrome 中工作，但在 Firefox 中损坏对齐。有人可以帮助我吗？问题出在“.menu_central .navegacao li”行中。没有“边框：1px 实心#000；宽度：215px；” 工作但不工作。

我需要在 Firefox 中对齐中心。

<html>
    <head>
        <meta http-equiv="Content-Language" content="pt-br" />
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
        <style>
            html { color: #000; background: #FFF; }
            body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td { margin : 0; padding : 0; }
            table { border-collapse : collapse; border-spacing : 0; }
            fieldset, img { border : 0; }
            address, caption, cite, code, dfn, em, strong, th, var { font-style : normal; font-weight : normal; }
            li { list-style : none; }
            caption, th { text-align : left; }
            h1, h2, h3, h4, h5, h6 { font-size : 100%; font-weight : normal; }
            q:before, q:after { content : ''; }
            abbr, acronym { border : 0; font-variant : normal; }
            sup { vertical-align: text-top; }
            sub { vertical-align: text-bottom; }
            input, textarea, select { font-family: inherit; font-size: inherit; font-weight: inherit; }
            legend { color : #000; }

            html, body {
                margin-top: 0px;
                margin-left: 0px;
            }
            .menu_central {
                width: 100%;
                position: fixed;
                top: 0px;
                left: 0px;
                border-bottom: 1px solid #000;
            }
            .menu_central .navegacao { 
                line-height: 30px;              
                text-align : center;                

                /* Firefox */   
                display: -webkit-box;
                -moz-box-pack: center;
                -moz-box-align: center;

                /* Safari and Chrome */
                display: -webkit-box;
                -webkit-box-pack: center;
                -webkit-box-align: center;

                /* W3C */
                display: box;
                box-pack: center;
                box-align: center;

            }
            .menu_central .navegacao li { 
                border: 1px solid #000;
                width: 215px;
            }
        </style>
    </head>
    <body>
        <div class="menu_central">
            <ul class="navegacao">
                <li><span class="inicial_nome">Q</span>uem Somos</li>
            </ul
        </div>
    </body>
</html>
4

2 回答 2

0

正如我在评论中所说

代替：

border: 1px solid #000;

和：

outline: 1px solid #000;

这是因为，轮廓不占用空间。所以它应该适用于每个浏览器。您可能需要为其余的 div 添加 1px 或 2px，因为边框已经消失。

于 2013-06-03T13:57:08.283 回答
0

您必须添加 display: inline-block。

因此，您的代码应如下所示：

.menu_central .navegacao li { 
    border: 1px solid #000;
    width: 215px;
    display: inline-block;
}
于 2013-06-03T13:58:18.507 回答