Log in Sign up
Back to feed
8 replies
Cedric · 7 months ago

Katrina ran in the same issue where the logo had a lot of dead space. I’m guessing the same applies to you. If that’s not the case, you can make it larger using CSS:

.page-header__logo img {
    height: 100px; 
    width: auto;
}

You'll need to test out the amount of px that is the best for you.

?
Deleted user OP · 7 months ago

If I change the height to 150px it cuts into the navigation menu.

Sir Chivas · 7 months ago

Replace your page_header CSS with the following:

.page-header__logo {
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    width: 100%;
    max-width: 80rem;
    margin-bottom: 65px;
}
Cedric · 7 months ago

And did you check if the logo had empty space ? Best practice would be to have z logo that just have the proper dimensions.

?
Deleted user OP · 7 months ago
Sir_Chivas said:

Replace your page_header CSS with the following:

.page-header__logo {
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    width: 100%;
    max-width: 80rem;
    margin-bottom: 65px;
}

I'm guessing if I want to increase the logo height I just modify the margin-bottom?

Sir Chivas · 7 months ago

No, if you want to increase the images height to 150px; use this instead:

.page-header__logo {
    margin-left: auto;
    margin-right: auto;
    height: 150px;
    width: 100%;
    max-width: 80rem;
    margin-bottom: 0px;
}
?
Deleted user OP · 7 months ago
Sir_Chivas said:

No, if you want to increase the images height to 150px; use this instead:

.page-header__logo {
    margin-left: auto;
    margin-right: auto;
    height: 150px;
    width: 100%;
    max-width: 80rem;
    margin-bottom: 0px;
}

Thank you

Sir Chivas · 7 months ago

No problem.

Create a free account to join the conversation.
Sign up free
ForumSpark © 2023 - 2026 · ForumSpark.net · Terms