Css background-image issue

Question

I am trying to set this image: http://www.flaticon.com/free-icon/linkedin-logo_34405#term=linkedin&page=1&position=1 as my background image, but it doesn't work...

Error in parsing value for 'background-image'. Declaration dropped.

Code(HTML):

<div class="linkedin"></div>

Code(CSS):

.linkedin {
    display: inline;
    background-image: url(../images/Linkedin(Idle).png);
    width: 16px;
    height: 16px;
}

Where do you get that error? BTW inline elements don't have width or height. — j08691
– j08691, Commented Nov 2, 2015 at 14:45

Blue · Accepted Answer · 2015-11-02 14:43:32Z

2

Try this:

.linkedin {
    display: inline;
    background-image: url('../images/Linkedin(Idle).png');
    width: 16px;
    height: 16px;
}

The parenthesis in the middle are interfering with the parser, and it's assuming the image ends right after Idle)

answered Nov 2, 2015 at 14:43

Blue

23k7 gold badges69 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Viktor Maksimov · Accepted Answer · 2015-11-02 14:44:40Z

1

Change display: inline; with display: inline-block;, also add background properties:

.linkedin {
    display: inline-block;
    background-image: url('../images/Linkedin(Idle).png');
    background-repeat: no-repeat;
    background-position: 0 0;
    width: 16px;
    height: 16px;
}

answered Nov 2, 2015 at 14:44

Viktor Maksimov

1,4651 gold badge10 silver badges11 bronze badges

1 Comment

Jojo01 Over a year ago

Thanks, this worked i am going to accept as soon as stackoverflow let's me.

Collectives™ on Stack Overflow

Css background-image issue

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related