This topic contains 1 reply, has 2 voices, and was last updated by  Anonymous 3 years, 4 months ago.

Font Awesome icon size


  • fisaman
    Participant

    Member Reply #2272

    I’m unable to change icon size with helper classes fa-2x, fa-3x, due to the following rule in component.css:

    [class^=”fa-“]:not(.fa-stack), [class^=”glyphicon-“], [class^=”icon-“], [class*=” fa-“]:not(.fa-stack), [class*=” glyphicon-“], [class*=” icon-“]

    {
    …..
    font-size: 14px;
    …..

     

    }

     

    Why helper classes does not take effects?

    Antonio (Italy)

     


    Anonymous
    Support Staff Reply #2282

    Dear Antonio,

    We apologize for late reply.

    Please update the following code

    .fa-2x {
    font-size: 2em; }

    .fa-3x {
    font-size: 3em; }

    .fa-4x {
    font-size: 4em; }

    .fa-5x {
    font-size: 5em; }

    with code below
    [class^=”fa-“]:not(.fa-stack).fa-5x,
    [class^=”glyphicon-“].fa-5x,
    [class^=”icon-“].fa-5x,
    [class*=” fa-“]:not(.fa-stack).fa-5x,
    [class*=” glyphicon-“].fa-5x,
    [class*=” icon-“].fa-5x {
    font-size: 2em;
    }

    [class^=”fa-“]:not(.fa-stack).fa-5x,
    [class^=”glyphicon-“].fa-5x,
    [class^=”icon-“].fa-5x,
    [class*=” fa-“]:not(.fa-stack).fa-5x,
    [class*=” glyphicon-“].fa-5x,
    [class*=” icon-“].fa-5x {
    font-size: 3em;
    }

    [class^=”fa-“]:not(.fa-stack).fa-5x,
    [class^=”glyphicon-“].fa-5x,
    [class^=”icon-“].fa-5x,
    [class*=” fa-“]:not(.fa-stack).fa-5x,
    [class*=” glyphicon-“].fa-5x,
    [class*=” icon-“].fa-5x {
    font-size: 4em;
    }

    [class^=”fa-“]:not(.fa-stack).fa-5x,
    [class^=”glyphicon-“].fa-5x,
    [class^=”icon-“].fa-5x,
    [class*=” fa-“]:not(.fa-stack).fa-5x,
    [class*=” glyphicon-“].fa-5x,
    [class*=” icon-“].fa-5x {
    font-size: 5em;
    }

    Kindest regards

Tagged: 

You must be logged in to reply to this topic.