1. MDB Home Page
  2. Support Main Page
  3. General Bootstrap questions
Topic: Fontawesome scaling

jcoshea pro asked 8 years ago

I'm trying to use Fontawesome to create large icons within buttons but the font scaling option does not seem to be working. <i class="fa fa-bar-chart-o fa-4x"></i>

Michal Szymanski staff answered 8 years ago

Unfortunately it's not, unless you want to play with our scss files. You have to adjust a button size to your needs (take a look at buttons.scss and variables.scss files). Thanks for motivating words!

jcoshea pro answered 8 years ago

Cheers for getting back to me. The icons scale fine outside of the button tags but not within. It works for me in regular Bootstrap, when I scale the Fontawesome icon it scales the button to the correct height. I prefer larger icons often with no text. Awesome Screenshot If it's not possible, that's okay. Keep up the great work

Michal Szymanski staff answered 8 years ago

For some reason my editor shows me warning when using your double quotes (green color): http://mdbootstrap.com/wp-content/uploads/2016/02/code.png Do you want to resize the button by resizing an icon? It's impossible. You can only change the button size directly. <button type="button" class="btn btn-default btn-xlg"><i class="fa fa-bar-chart-o"></i> button</button>

jcoshea pro answered 8 years ago

That's just the way they pasted in here, I use the standard Double Quotes " ". Even copying and pasting your code makes no difference. Here is the full code for the button, and icon doesn't scale. 
<button class="btn btn-success btn-block waves-effect waves-light">
     <i class="fa fa-bar-chart-o fa-5x"></i>
</button>

Michal Szymanski staff answered 8 years ago

You have used wrong quotation marks. Try this: <i class="fa fa-bar-chart-o fa-5x"></i>
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Specification of the issue
  • ForumUser: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags
About author
jcoshea
Pro User 10Support score
2Questions 4Answers 0Snippets