CODEWITHSUNDEEP
csshtmlfont-awesome
Kyc Atm
Kyc Atm

Reputation: 11

Keep the font awesome spinner icon from at the original place

When I put the icon fa fa-spinner fa-spin the icon starts itself rotating. Although the spinning dots rotate fine.

Ex :- http://farzikam.cf/a click the submit button and see

Upvotes: 1

Views: 668

Answers (3)

Dhruvil21_04
Dhruvil21_04

Reputation: 2189

Add this CSS and it should work fine....

#btn .fa-spin {
    padding: 0;
}
#btntext {
    padding: 0 10px 0 0;
}

Upvotes: 0

R. Becker
R. Becker

Reputation: 56

Remove the padding from your icon and add a margin to your button text like: 

#btntext{
  margin-right: 15px;
}

You should also use classes instead of id´s for that case.

Upvotes: 1

daan.desmedt
daan.desmedt

Reputation: 3820

Solve it by removing the top / bottom padding from your buttons icon

<button id="btn" onclick="load()">
  <div id="btntext">Submitting</div>
  <i id="plus" class="fa fa-spinner fa-spin" style="padding: 0;margin-left: 7px;"></i> 
</button>

Upvotes: 1

Related Questions