Damir
Damir

Reputation: 56179

Icon inside button in HTML

I need to put small icon inside button in HTML (for example I need to have facebook button on my site, inside button first F icon and then "facebook"). How to do that ?

Upvotes: 7

Views: 64856

Answers (3)

Alec
Alec

Reputation: 9078

.facebook-button {
  background: url('https://2.bp.blogspot.com/-lFFvYHv-Z8w/WAOFS0P5FdI/AAAAAAAAF68/Aiv0D5NkUKIbL3_6G42LZm1iQ6co1tmgACLcB/s320/facebook-16px.png') left center no-repeat;
  padding-left: 15px;
}
<!DOCTYPE html>
<html>

<body>
<input type="button" class="facebook-button" value=" Facebook" />
</body>
</html>

Upvotes: 10

user3677801
user3677801

Reputation: 1

Add the following data using the path name for the image

 <img src="images/facebook-logo.png"/> 

Add the width and height attributes if you want to resize the icon

 <img src="images/facebook-logo.png" width="75" height="75"/> 

Upvotes: 0

Quentin
Quentin

Reputation: 943142

<button><img src="facebook.png" alt=""> Facebook</button>

Upvotes: 16

Related Questions