How to get rid of free space in react-icons (bootstrap)?

Asked Jul 12 '20 at 12:52

Active Jul 12 '20 at 14:00

Viewed 38 times

I'm trying to use the react-icons but there's one problem. Every icon has weird margin at the top. How to get rid of this?

EDIT:

.mobileNavbar {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    @include yellow(background-color);
    @include red(color);
    width: 100%;
    position:sticky;
    bottom: 0;

    .icon {
        font-size: 1.3em;
    }

    @media (min-width: $tablet) {
        .icon {
            font-size: 1.5em;
        }
    }
}

edited Jul 12 '20 at 14:00

asked Jul 12 '20 at 12:52

Sevy

Does it still have this margin if you set the css to make the icon square? – Victor Axelsson Jul 12 '20 at 13:44
This could be happening due to many reasons, try to post your code, or even better, a reproducible example on https://jsfiddle.net/ – Yossi Vainshtein Jul 12 '20 at 13:47
@VictorAxelsson – Sevy Jul 12 '20 at 14:01

How to get rid of free space in react-icons (bootstrap)?

0 Answers0