Max-Width-Rendering nicht in Safari

Bitte check this fiddle Max-Width-Rendering nicht in Safari

Dies ist, wie sein Aussehen in Firefox und Chrome .., die meine ursprünglichen Layout ist.

enter image description here

Und seine, wie es in Safari sieht, die ich lösen wollen. Jede Hilfe wäre willkommen.

enter image description here

.top { 
    background: #edebe6; 
    height: 80px; 
} 
.intop { 

    max-width: 1080px; 
    margin: 0 auto; 
    display: table; 
    width: 100%; 
} 
.logo { 
    width: 20%; 
    float: left; 

} 
.logo img { 
    display: table-cell; 
    vertical-align: middle; 
    margin-top: 15px; 
} 
.svg-menu { 
    display: none; 
} 
.nav-wrap { 
    width: 68%; 
    float: left; 
    height: 80px; 
    display: table; 
} 
ul.nav { 
    list-style: none; 
    float: right; 
    margin-top: 23px; 
    margin-right: 45px; 

} 
ul.nav li { 
    display: inline-block; 
    margin-left: 35px; 
    text-transform: uppercase; 
    font-size: 12px; 
    font-weight: bold; 
} 
ul.nav li a { 
    color: #403b33; 
} 
ul.nav li a:hover { 
    background: none; 
    color: #d3643b; 
} 

ul.nav li.current-menu-item a { 
    color: #d3643b; 
    position: relative; 
} 
ul.nav li a::after { 
    position: absolute; 
    top: 100%; 
    left: 0; 
    right: 0; 
    margin: auto; 
    width: 60%; 
    height: 1px; 
    background: #d3643b; 
    content: ''; 
    opacity: 0; 
    -webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s; 
    -moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s; 
    transition: height 0.3s, opacity 0.3s, transform 0.3s; 
    -webkit-transform: translateY(-10px); 
    -moz-transform: translateY(-10px); 
    transform: translateY(-10px); 
} 
ul.nav li a:hover::after, 
ul.nav li a:focus::after { 
    height: 2px; 
    opacity: 1; 
    -webkit-transform: translateY(0px); 
    -moz-transform: translateY(0px); 
    transform: translateY(0px); 
} 
ul.nav li.current-menu-item a:after { 
    content: ''; 
    height: 2px; 
    width: 60%; 
    background: #d3643b; 
    position: absolute; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    margin: auto; 
} 
.top-cart { 
    width: 12%; 
    float: left; 
    height: 80px; 
    display: table; 
    text-align: right; 
    padding-right: 18px; 
    background: #83b4a4 url(images/cart.png) no-repeat 20px center; 
} 
.top-cart a { 
    vertical-align: middle; 
    display: table-cell; 
    color: #fff; 
    text-transform: uppercase; 
    font-size: 14px; 
    text-transform: uppercase; 
    font-weight: bold; 
    color: #fff; 
} 


@media only screen and (max-width: 1080px) { 
    .in-fea-home, #container, .logo { 
     padding-left: 20px; 
     padding-right: 20px; 
    }  
    .top-cart { 
     width: 65px; 
     float: right; 
     position: absolute; 
     right: 0; 
     padding: 0; 
    } 
    .top-cart a { 
     margin-right: -25px; 
     padding-right: 27px; 
     padding-top: 14px; 
    }.rhide { 

     display: none; 
    } 
} 
@media only screen and (max-width: 767px) { 

    .nav-wrap { 

     display: none; 
    } 

    .logo { 
     width: 100%; 
     text-align: center; 
    } 

    .svg-menu { 
     display: block; 
     width: 20%; 
     float: left; 
     position: absolute; 
     left: 15px; 
     padding-top: 27px; 
    } 
    .footer { 

     text-align: center; 
    } 
    #container ul.products li { 
    width: 70%; 
    margin: 0 auto; 
} 
.ff, .gff { 
    margin-bottom: 55px; 
} 
} 

@media only screen and (max-width: 534px) { 


} 


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ 
@media only screen and (max-width: 479px) { 
    button.single_add_to_cart_button { 
    background: #83b4a4; 
    border: none; 
    border-radius: 3px; 
    padding: 10px 17px; 
    padding-bottom: 9px; 
    font-size: 13px; 
    text-transform: uppercase; 
    color: #fff; 
    margin-left: 15px; 
    font-weight: bold; 
    display: block; 
    float: left; 
    margin-left: -120px; 
    margin-top: 50px; 
} 

}

Quelle

2013-12-20 Vikas Ghodke

ich weiß nicht warum, aber das Problem kommt für mich sogar in Chrom –

entfernen Anzeige: Tisch-Zelle von .logo img –