koque
koque

Reputation: 2256

Setting image in input element background not working

I am trying to set an image within an input element but the image is not showing.

html:

    <div class="col-md-12">
        <input class="form-control ccnumber" type="text" id="creditCardNo" 
          formControlName="creditCardNo">
    </div>

css:

.ccnumber {
    background-image: url("creditcard.png");
    background-repeat: no-repeat;
    background-position: left;
    background-attachment: fixed;
}

Upvotes: 0

Views: 29

Answers (1)

Suren Srapyan
Suren Srapyan

Reputation: 68665

Check your path to the image. Your code is working fine. Check your network to see why it isn't loaded.

.ccnumber {
    background-image: url("https://www.w3schools.com/css/img_fjords.jpg");
    background-repeat: no-repeat;
    background-position: left;
    background-attachment: fixed;
}
<div class="col-md-12">
    <input class="form-control ccnumber" type="text" id="creditCardNo" 
         formControlName="creditCardNo">
</div>

Upvotes: 2

Related Questions