CODEWITHSUNDEEP
htmlcssfirefox
totothegreat
totothegreat

Reputation: 1643

content not working in firefox and internet explorer?

I have this simple css code that works on chrome, but not on internet explorer and firefox, what am i missing?

.removeIcon{
   content: url(../images/remove.png) no-repeat;
   display: inline-block;
  width: 25px;
  height: 25px;
 margin-left:5px;
 cursor: pointer;
 margin-top:9px;
}

What is the cause of this and how do i fix it?

Upvotes: 0

Views: 81

Answers (1)

Jordan Burnett
Jordan Burnett

Reputation: 1844

You probably want to be using the background property rather than the content property. 

.removeIcon{
   background: url(../images/remove.png) no-repeat;
   display: inline-block;
   width: 25px;
   height: 25px;
   margin-left:5px;
   cursor: pointer;
   margin-top:9px;
}

The content property is only for creating generated content on :before and :after pseudo elements, it doesn't quite work in the way you're using it. See http://css-tricks.com/css-content/

Upvotes: 2

Related Questions