Need to make clickable area in header larger

[BB_Tech]

Hello I currently have a image for one of my menu items, but the clickable area is very small. Only the tractor. I would like to make it the full size of the image. 

[Avi_choudhary]

on this URL https://biggers-market.myshopify.com/pages/biggers_home it's on the full image,

if you are working on another theme then share your theme  preview link 

[BB_Tech]

Hello I am talking about the second smaller image they alternate based on the pages 

[Avi_choudhary]

yes got it, add this code to your theme in this section(marked)

a.header__menu-item.header__menu-item.list-menu__item.link.link--text.focus-inset::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
#shopify-section-header .header__inline-menu ul.list-menu.list-menu--inline li:first-child {
    position: relative;
}

stylesheet

[BB_Tech]

I am having some trouble figuring out where to place it, could you be more specific?

[PageFly-Victor]

Hi @BB_Tech ,

This is Victor from PageFly - Landing page builder, I’d like to suggest this idea:

Step 1. Go to Online Store -> Theme -> Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before </body> :

<style>
a[href="/pages/how-it-works"] {
     width: 200px;
     height: 65px;
     padding: unset;
}
</style>

Hope my answer will help you.

Best regards,

Victor | PageFly

[BB_Tech]

Couldn't get that to work very robustly, is there a way to reference the first item in the header menu no matter what the current menu handle is