css: Wo sind die weißen Hintergrundrahmen für Textfelder?

Question

Ich habe die folgende Seite:

http://www.jameschang.com/faxlogic/

, wo die Textfelder haben diese weißen Ränder auf an ihren vier Ecken in dem oberen rechten Login-Bereich.

Ich habe die folgende CSS-Attribute für die Textfelder:

.HeaderLoginField { 
    background-image: url(../content/login_field.png); 
    float: left; 
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; 
    font-size: 12px; 
    color: #969696; 
    border-top-width: 0px; 
    border-right-width: 0px; 
    border-bottom-width: 0px; 
    border-left-width: 0px; 
    border-top-style: none; 
    border-right-style: none; 
    border-bottom-style: none; 
    border-left-style: none; 
    height: 25px; 
    width: 160px; 
    text-indent: 3px; 
    background-color: #0F0F0F; 
    background-repeat: no-repeat; 
    font-weight: normal; 
} 

irgendwelche Ideen, warum dies passiert sein könnte? Ich habe die PNG-Bilder in ein gif geändert und sie gehen weg, aber ich möchte png verwenden. Irgendwelche Ideen, warum das passiert?

Dank im Voraus

Answer 1

Es ist definitiv das Bild, das Sie verwenden, ich inspizierte das Element mit Firebug und wenn deaktiviert/aktiviert das Hintergrundbild, gingen die weißen Ecken weg!

Answer 2

sein das Hintergrundbild, Sie ein neues Bild machen können, oder das Aussehen erhalten Sie mit CSS sollen.

Answer 3

Es ist die Grafik: url("../content/login_field.png"), die zu einem weißen Hintergrund anstelle von schwarz Antialiasing scheint. Das PNG könnte stattdessen Transparenz verwenden, um unabhängig vom Hintergrund zu arbeiten.

Answer 4

Haben Sie vergessen, die Transparenz für Ihre PNG-Datei einzuschalten?

Answer 5

Wenn Sie 8bit (indizierte) PNG anstelle von 24bit PNG verwenden möchten, verwenden Sie Schwarz als matt (die Farbe ist die Farbe, an die sich die Ränder des transparenten Bildes anschmiegen) statt weiß, aber es ist besser zu verwenden 24bit PNG mit Alpha-Transparenz, so wird es auf jedem Hintergrund funktionieren.