Responsive Design justificar an centro

[ceaped]

Buenos días

Estoy dando mis primeros pasos con "Responsive Design".

Tengo este CSS:

Código CSS:

@media screen and (min-width: 240px) { 
    nav{
    width: 100%;
    height: 40px;
    background-color: #97DF35;
    padding-top: 2%;
    padding-bottom: 2%;
    }
    
    #menu_comunidad li img  {
    height: 70%;
    width: 70%;
    margin-left: 15%;
    margin-right: 15%;
    display: inline;
    border:none !important;
    }
}
 
@media screen and (min-width: 700px) { 
    nav{
    width: 100%;
    height: 40px;
    display: inline-block;  
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    background-color: #97DF35;
    }
    
    #menu_comunidad li img  {
    height: 63%;
    width: 63%;
    margin-left: 10px;
    margin-right: 10px;
    display: inline;
    border:none !important;
    }
}
 

El funciona bien, el problema que tengo es:

Cuando roto el celular horizontalmente y vuelvo y lo roto vertical se me desajusta y me queda justificado a la izquierda y se oculta parte.

¿Cómo hago para que al rotar el celular horizontal y vertical me quede en el centro?

Gracias por su ayuda

[pzin]

¿Tienes puesto el viewport sin opción de que el usuatio haga zoom?