Firefox "slide" transizioni al passaggio del mouse

Question

Prima e per la maggior parte vorrei dire "Ciao" alla comunità. Sono un web designer junior entry-level appena uscito dalla scuola professionale. La maggior parte del mio stile in CSS mi è stata insegnata e questo mi ha portato ad alcuni problemi. Come quello qui sotto.

Questo è un esempio della mia barra di navigazione che sto utilizzando per il mio sito. Si suppone che ognuna delle caselle divino scivoli verso le posizioni corrispondenti in 2 secondi. Tuttavia, con ogni browser a parte il chrome, si bloccano rapidamente invece di una transizione fluida.

http://jsfiddle.net/kwh71787/cxBxL/

Se qualcuno ha qualche intuizione si prega di aiutare

Answer 1

Provare a utilizzare questo stile invece:

#navbuttons div { 
    position: absolute; 
    left: 0px; 
} 

DEMO

Answer 2

Benvenuti a Stack Overflow!

Questo sembra aggiustarlo. Quello che ho fatto è che ho aggiunto top: 0px; and left: 0px; a ciascun div.

Ecco un aggiornamento jsfiddle

Speranza che aiuta!