Datacrawler
Datacrawler

Reputation: 2876

Replace Icons with Images in HTML/CSS

I am trying to create a beautiful box on html/css which is like that :

And I am trying to change the icons to look like :

Here is the original code :

#pricing-table .pricing .pricing-list ul li i {
  margin-right: 12px;
  color: #bdc3c7;
}

And by applying this change it does not work :

#pricing-table .pricing .pricing-list ul li i {
  margin-right: 12px;
  background-image: url("./Startup Framework Inspired Pricing Table_files/images/background.jpeg");
}

I tried this one and it is working but is it the optimal way?

<li>
  <img id="icons" src="./Startup Framework Inspired Pricing Table_files/images/icon.jpg">
  <span> +/- % </span> MTD
</li>

Upvotes: 0

Views: 859

Answers (1)

sTx
sTx

Reputation: 1221

if u use background-image you must specify some width and height for the element

Upvotes: 1

Related Questions