Resize badge in Custom CSS

Site URL: https://www.bonomomusic.com

Hi all,

I've added a badge to my navigation bar at the top of my page. The code is located in Design -> Custom CSS. 

Thing is, the badge appears too small (see attached pic). I would like to enlarge it but I'm not sure how to go about doing that. I'm not a coder, and I simply copy and pasted the code from the website I got it from.

Can anyone help out with this? Thanks!

.Header-nav-inner a:last-of-type {
    line-height: 5em;
}

3 minutes ago, rwp said:

.Header-nav-inner a:last-of-type {
    line-height: 5em;
}

 

Hi, sorry but not sure what to make of this.

I found something similar in my code. Can you please tell me where to insert your code into it?

a.Header-nav-item[href*="soundbetter"] {
    background-image: url(https://d2p6ecj15pyavq.cloudfront.net/assets/SoundBetterBadge-1bc672131a12c38bd822195fbe5d0e17.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    color: transparent !important;
}

Just add BelinGoodMan's code to Custom CSS, you should not have to change your code. 

You can add my code to the bottom of design -> custom CSS

Leave your other code as is.

10 minutes ago, rwp said:

.Header-nav-inner a:last-of-type {
    line-height: 5em;
}

 

OMG awesome! Totally works, thanks!

 But how can I adjust the size of the badge specifically? Changing 'xem' adjusts the width of the navigation bar. 

On 9/24/2020 at 7:32 PM, BerlinGoodMan said:

OMG awesome! Totally works, thanks!

 But how can I adjust the size of the badge specifically? Changing 'xem' adjusts the width of the navigation bar. 

I think I answered your email. If it works, you can share it here for other members.