Font Awesome in user rank

    Hello everyone,


    I'd like to add an icon before user rank, I already did it with this:

    CSS
    1. .userTitleBadge.red::before {
    2. font-family: "FontAwesome";
    3. content: "\f0e8";
    4. }


    As a result I obtain this:



    How can I add some space right after the icon? I tried adding an space after the unicode ("\f0e8 ") but I got the same result.


    Regards.

    My styles and plugins in the Plugin-Store.

    Display Spoiler

    ♪Quiero robarle los minutos a las horas pa' que mis padres nunca se me pongan viejos...♫

    Untested but will one of these two not work.


    Code
    1. .userTitleBadge.red::before {
    2. font-family: "FontAwesome";
    3. content: "\f0e8";
    4. margin-right: 4px;
    5. }


    Or this one.


    Code
    1. .userTitleBadge.red::before {
    2. font-family: "FontAwesome";
    3. content: "\f0e8";
    4. padding-right: 4px;
    5. }
    Quote from Caribe_Soy

    How can I add some space right after the icon? I tried adding an space after the unicode ("\f0e8 ") but I got the same result.

    No idea, but instead of using space bar to create a space, you could try inserting a none line breaking HTML code space entry like this below

    Code
    1.  

    Thanks @GTB, I'm not sure where I should add the

    HTML
    1.  


    in the template:


    Smarty: messageSidebar
    1. <div class="userTitle">
    2. <p class="badge userTitleBadge{if $userProfile->getRank() && $userProfile->getRank()->cssClassName} {@$userProfile->getRank()->cssClassName}{/if}" itemprop="title">{$userProfile->getUserTitle()}</p>
    3. </div>


    Anyway, I already solved it. It was something stupid: I was trying to add a margin to the element without the ::before, so I thought it had to be via unicode. I got it working now:

    CSS
    1. .userTitleBadge.red::before {
    2. font-family: "FontAwesome";
    3. content: "\f0e8";
    4. margin-right: 5px;
    9. }

    My styles and plugins in the Plugin-Store.

    Display Spoiler

    ♪Quiero robarle los minutos a las horas pa' que mis padres nunca se me pongan viejos...♫