IE7 BUTTON biały kontur

Question

Czy ktoś wie, dlaczego IE6 i IE7 dodać białą granicę między granicy button i tła?

Oto mój CSS i HTML:

#reportButton{ 
    background:#fefcda url(buttonback.png) repeat-x bottom left; 
    border-top:2px solid #fffff8; 
    border-right:2px solid #e3b40c; 
    border-bottom:2px solid #e3b40c; 
    border-left:2px solid #fffff8; 
    color: #373535; 
    font-weight: bold; 
    margin:0 2%; 
    width:45%; 
} 

<button id="reportButton">Report a Concern</button> 

Jeśli spróbujesz to widać śmieszną białą obwódkę pomiędzy granicami i tłem. Nie pojawia się w żadnej innej przeglądarce, nawet w IE8.

Ktoś ma prostą poprawkę lub sugestię co do tego, co robię źle?

Dzięki!

EDYCJA: Właśnie zauważyłem, że kiedy klikam przycisk, maszerują mrówki i biała ramka znika. Wygląda na to, że gdy przycisk jest :active, znikają, chociaż nie pomoże mi to w rozwiązaniu problemu, może będzie dla kogoś innego.

Przykro mi, ale nie mogę podać ekranu; Nie mam teraz możliwości przesłania go przez to połączenie internetowe.

EDIT2: Wygląda na to, że ramka nie jest biała, ale przycisk background-color. Wygląda na to, że IE pozostawia lukę 1px między obramowaniem przycisku a obrazem tła przycisku.

Answer 1

Upewnij się, że granica nie pochodzi z samego obrazu (tło obrazu), ustawić dokładny width i height także spróbować ustawić padding do 0 jak @SLaks powiedział.

Answer 2

Miałem ten sam problem ... fajna sztuczka, która wydaje się działać przynajmniej dla IE: "Biały" kontur jest w rzeczywistości kolorem tła twojego zdjęcia. Ustaw tak, aby był taki sam jak kolor obramowania. Jeśli nie masz nic przeciwko nieznacznie grubej granicy, zatrzymaj się. Jeśli obramowanie jest teraz zbyt grube, ustaw kolor ramki na kolor tła strony.

np. aby wyświetlić czarny "border" użyj tego css dla swojego przycisku: background: url (./ button_bg.gif) no-repeat; kolor tła: # 000000; border: 1px solid #FFFFFF;