Strange box at the bottom of my mobile menu

[johnyct9760]

Hello,

I’ve got a strange box rendering at the bottom of my mobile menu on the following site:

https://toothandnailgrooming.com/home/

Please see screenshot:

I would like to get rid of this gap, thank you for the help.

John

[prakash_s]

Hello John,

Thanks for writing to us.

In order to remove the gap from the menu item, you need to remove the margin-bottom which you have added through the custom CSS code. Please have a look at the given screenshot below.

.menu-item-269 a span {
    background-color: #E80D72;
    padding: 15px;
    margin-bottom: 100px;
    border-radius: 10px;
    box-shadow: 0px 2px 5px #00000070;
    color: white;
}

Update the above code with the given code

.menu-item-269 a span {
    background-color: #E80D72;
    padding: 15px;
    margin-bottom: 0px; 
    border-radius: 10px;
    box-shadow: 0px 2px 5px #00000070;
    color: white;
}

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector or you subscribe to One where customization questions are answered.

Hope it helps.
Thanks