Bigger Glyphicons

Question

How do I make bigger Glyphicons in twitter bootstrap 3 0  not 2 3 x     This code will make my glyphicons big    lt button type  button  class  btn btn-default btn-lg  gt      lt span class  glyphicon glyphicon-th-list  gt      lt  span gt   lt  button gt    How can I get this size without using the btn-lg class while using only a span    This gives a small glyphicon    lt span class  glyphicon glyphicon-link  gt  lt  span gt

User · Answer

The  btn-lg class has the following CSS in Bootstrap 3  link     btn-lg     padding  10px 16px    font-size  18px    line-height  1 33    border-radius  6px      If you apply the same font-size and line-height to your span  either  glyphicon-link or a newly created  glyphicons-lg if you re going to use this effect in more than one instance   you ll get a Glyphicon the same size as the large button

User · Answer

Write your  lt span gt  in  lt h1 gt  or  lt h2 gt     lt h1 gt   lt span class  glyphicon glyphicon-th-list  gt  lt  span gt  lt  h1 gt

User · Answer

x000D   x000D   lt button class  btn btn-default glyphicon glyphicon-plus fa-2x  type  button  gt  x000D   lt  button gt  x000D   x000D   lt  --fa-2x   fa-3x   fa-4x     -- gt  x000D   lt button class  btn btn-default glyphicon glyphicon-plus fa-3x  type  button  gt  x000D   lt  button gt  x000D   x000D   x000D

User · Answer

You can just give the glyphicon a font-size to your liking   span glyphicon-link       font-size  1 2em

User · Answer

If you are using bootstrap 3  use tag  like this  lt small gt  lt span class  glyphicon glyphicon-send  gt  lt  span gt  lt  small gt  It works perfect for Bootstrap 3  You can even use multiple  lt small gt  tags to set the size more smaller   Code   lt small gt  lt small gt  lt span class  glyphicon glyphicon-send  gt  lt  span gt  lt  small gt  lt  small gt

User · Answer

Here s how I do it    lt span style  font-size 1 5em   class  glyphicon glyphicon-th-list  gt  lt  span gt    This allows you to change size on the fly   Works best for ad hoc requirements to change the size  rather than changing the css and having it apply to all

User · Answer

In my case  I had an input-group-btn with a button  and this button was a little bigger than its container  So I just gave font-size 95  for my glyphicon and it was solved    lt div class  input-group  gt       lt input type  text  class  form-control  id  pesquisarinbox  placeholder  Pesquisar na Caixa de Entrada  gt       lt div class  input-group-btn  gt           lt button class  btn btn-default  type  button  gt               lt span class  glyphicon glyphicon-search  style  font-size 95    gt  lt  span gt           lt  button gt       lt  div gt     lt  div gt

[css] Bigger Glyphicons

Examples related to css

Examples related to twitter-bootstrap

Examples related to twitter-bootstrap-3

Examples related to glyphicons