html - Css code for center navigation menu is not working in firefox -


my css code following:-

    #nav {       position: relative;       display: block;        margin: 0;       background: #333;       z-index: 1;       border-bottom: 1px solid #666;       font-weight: 600;       font-family: helvetica, arial, sans-serif;       font-size: 14px;       -webkit-box-align: center;       -webkit-box-pack: center;       display: -webkit-box;     } #desktop-nav .nav-item {   display: block;   padding: 0 20px;   float: right;   -webkit-transition: color 200ms linear;    transition: color 200ms linear; }  #desktop-nav .nav-item:hover, #desktop-nav .nav-item:active {   opacity: 0.7; } 

and html code is:--

<div id="nav">                <nav id="desktop-nav">             <a class="nav-item" href="#1">github</a>             <a class="nav-item" href="#2">about</a>             <a class="nav-item" href="#3">community</a>             <a class="nav-item" href="#4">docs</a>         </nav> 

here,i use below code make center navigation menu..

 -webkit-box-align: center;       -webkit-box-pack: center;       display: -webkit-box; 

but working in google chrome..but not in firefox..i need cross browser compatiable code mozilla????

there multiple ways it, can either give div text-align : center css property, or put div:

-webkit-box-align: center; -webkit-box-pack: center; -moz-box-align: center; -moz-box-pack: center; display: -webkit-box;` 

Comments

Popular posts from this blog

Fail to load namespace Spring Security http://www.springframework.org/security/tags -

sql - MySQL query optimization using coalesce -

unity3d - Unity local avoidance in user created world -