How to add text next to the \f0c9 icon (main navigation icon) but only in mobile

Hello again :slight_smile:

My page is www.riihonmajatalo.fi

I would like to add a piece of text next to the main navigation icon \f0c9 but only when in mobile. The result should look like this: \f0c9 Valikko (/* Valikko means Menu in Finnish */)

Is there a easy way to do this?

Thanks again!

Mikko

Hello Mikko,

It looks like you have added this custom CSS code (row 320-322):

.btn-menu:before{
    content: "\f0c9";
}

…please try to use this instead:

#masthead .btn-menu:before{
    content: "\f0c9 Valikko";
}

Kind Regards, Roman.

Hi,

Thank you Roman again. That did the trick. Now, how do I get a little bit of space between \f0c9 icon ja the text “Valikko”?

Thank you for your effort :slight_smile:

mikko

Mikko, please try to use this CSS code instead of previous:

#masthead .btn-menu::before {
    content: "\f0c9  Valikko";
}

#masthead .btn-menu {
    width: 134px;
}

Please note that there are two spaces between \f0c9 and Valikko.

Kind Regards, Roman.

Hi Roman,

Thank you for your asnweres and patience with me :slight_smile: That helped me again.

Regards,

Mikko

Great! You are welcome Mikko :slight_smile:

Kind Regards, Roman.