διαφορετικη εμφανιση στο firefox και chrome

[Gunix]

Καλησπέρα σας.

Έχω το έξης πρόβλημα. Έτρεξε την σελίδα μου με το firefox και μου διχνεί κανονίκα το menu που έχω δώσει width 960px και στο chrome διαφορετικα δηλάδη λες και μου το έχει 960+20px. Αλλά αν πηράξω το width και το κάνω πχ 940px στο chrome το δίχνει κανονικά ένω αν ανοίξω το firefox την τελευταια στηλη μου την πάει από κάτω.

Πως μπορώ να το διορθώσω αυτό ώστε να είναι ίσα και μην δίχνει διαφορετικά?

body{
	width:960px;
	margin:0 auto;
	}

#logo{
	height:100px;
	;
	margin-top: 20px;
	}
	
/*1ο step*/
#menu, #menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
	
}

/*Καθορίζουμε το template*/
#menu {
    width: 960px;
    margin: 35px auto 40px;
    border: 1px solid #F7F3ED;
    background-color: #F7F3ED;
    background-image: linear-gradient(#dfd6cb, #dfd6cb);
    border-radius: 12px;
    box-shadow: 0 1px 1px #dfd6cb;


}

/*3ο step*/
#menu:before,
#menu:after {
    content: "";
    display: table;
}

#menu:after {
    clear: both;
}

#menu {
    zoom:1;
}

/*4o step*/
#menu li{
    float: left;
    border-left: 1px solid #F7F3ED;

    position: relative;
}

#menu > li{
	text-align:center;
	}
	
#menu a {
    float: left;
    padding: 6px 12px;
    color: #636466;
    font: bold 14px Arial;
    text-decoration: none;
	
}

#menu li:hover > a {
    color: #fff;
}

*html #menu li a:hover { /* IE6 only */
    color: #fff;
}

/*5o step*/
#menu ul {
	text-align: left;
	min-width:100%;
    margin: 20px 0 0 0;
    _margin: 0; /*IE6 only*/
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1;    
    background: #dfd6cb;   
    background: linear-gradient(#dfd6cb, #dfd6cb);
    box-shadow: 0 -1px 0 #dfd6cb;  
    border-radius: 3px;
    transition: all .2s ease-in-out;
}

#menu li:hover > ul {
    opacity: 1;
    visibility: visible;
    margin: 0;
}

#menu ul ul {
    top: 0;
	left:101%;
    margin: 0 0 0 20px;
    _margin: 0; /*IE6 only*/
    box-shadow: -1px 0 0 #dfd6cb;      
}

#menu ul li {
    float: none;
    display: block;
    border: 0;
    _line-height: 0; /*IE6 only*/
    box-shadow: 0 1px 0 #F7F3ED, 0 2px 0 #F7F3ED;
}

#menu ul li:last-child {   
    box-shadow: none;    
}

#menu ul a {    
    padding: 10px;
    _height: 10px; /*IE6 only*/
    display: block;
    white-space: nowrap;
    float: none;
    text-transform: none;
}

/*#menu ul a:hover {
    background-color: #F7F3ED;
    background-image: linear-gradient(#F7F3ED, #dfd6cb);
}*/

/*7o step*/
#menu ul li:first-child > a {
    border-radius: 2px 3px 0 0;
}

#menu ul li:first-child > a:after {
    content: '';
    position: absolute;
    left: 40px;
    top: -6px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #636466;
}

#menu ul ul li:first-child a:after {
    left: -6px;
    top: 50%;
    margin-top: -6px;
    border-left: 0; 
    border-bottom: 6px solid transparent;
    border-top: 6px solid transparent;
    border-right: 6px solid #636466;
}

#menu ul li:first-child a:hover:after {
    border-bottom-color: #F7F3ED; 
}

#menu ul ul li:first-child a:hover:after {
    border-right-color: #F7F3ED; 
    border-bottom-color: transparent;   
}

#menu ul li:last-child > a {
    border-radius: 0 0 3px 3px;
}

.menu-icon{
	height: 40px;
	margin: 10px;
}

[alou]

Μάλλον θες reset, δοκίμασε να βάλεις αυτό στην αρχή του css σου, πριν από οτιδήποτε άλλο. Γενικά το χρησιμοποιούμε αυτό ή κάτι ανάλογο σε όλες τις περιπτώσεις.

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

http://meyerweb.com/eric/tools/css/reset/

[Gunix]

Τιποτα. Το ίδιο. Δεν αλλαξε κατι

[alou]

Αν το βάλεις κάπου και μπορούμε να το δούμε θα βγει κάτι, αλλιώς δεν γίνεται (html + css σε ένα αρχείο έστω επισύναψη ή codepen jsfiddle κλπ)

[XPHSTOS_]

Θα σου έλεγα να περάσεις τον κώδικα σου από κάποιο auto-prefixer για παν ενδεχόμενο και να κρατήσεις και το reset το φίλου πιο πάνω.

Τέλος μπορείς να δοκιμάσεις και κάτι τέτοιο.

Site: userAgent