Search code examples
csstextboxformborderstyle

css : where are the white background borders on textboxes coming from?

I have the following page:

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

where the textboxes have these white borders on on their 4 corners in the upper right login section.

I have the following css attributes for those textboxes: 

.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;
}

any ideas why this might be happening? I have changed the png images to a gif and they go away however i want to use png. Any ideas why this is happening?

thanks in advance

Solution

  • Its definitely the image you're using, i inspected the element using firebug and when disabled/enabled the background image, the white corners went away!