Botón HTML que se mueve en la página de actualización?

Así que noté este error el otro día donde el botón para el inicio de sesión se moverá a una ubicación diferente cuando la página se actualice. Sin embargo, si la página se carga desde el enlace, permanece en la posición correcta. Estoy dejando en blanco en cuanto a por qué esto haría esto, aquí está el enlace y el código de mi sitio.

Sitio web: http://www.clanrippgaming.net/

HTML :

 

CSS :

 .login_box { float: right; width: 330px; height: 75px; margin-top: 7px; margin-right: -5px; list-style: none; } .login_box li { } .login_box li a { color: #BDBDBD; text-decoration: none; padding-left: 60px; padding: 0px; } .logged_in { background-image: url(images/bg_login2.png); border: 3px solid#000000; outline: 1px solid#BDBDBD; width: 304px; height: 55px; margin-left: -2px; padding-top: 5px; } .logged_out { margin-right: 38px; } .logged_out_txt { margin-top: -20px; } 

Actualice los siguientes cambios a sus clases de CSS y todo estará bien.

CSS

 .logged_out { margin-right: 22px; position: relative; } .button { position: absolute; top: 0; right:0; } 

Eliminar display:inline; float:right; margin-top: 0; and margin-left: 4px display:inline; float:right; margin-top: 0; and margin-left: 4px display:inline; float:right; margin-top: 0; and margin-left: 4px desde .button

Al mirar su sitio web, le sugiero hacer los siguientes cambios a su CSS:

 .button { display: inline-block; float: right; } .logged_out { margin-right: 22px; }