Jump to content

How do I make a text hover background take up the full space and ignore the padding?

Recommended Posts

Site URL: https://bassoon-oleander-texb.squarespace.com/

Password: 12345


Very new to this! I'm trying to make the green hover background for the text take up the full space in the folder nest (between each line) without affecting the padding of the text itself.  Right now there's a white margin around the hover background due to the padding. 

Here's the code I'm using: 

.header-nav .header-nav-item--folder .header-nav-folder-content {
    top: auto;
    left: 0em;
    text-align: left;
    width: 175px;
   font-size: 14px;
   padding-top: 0px;
   padding-bottom: 0px;
   padding-left: 3px;
   padding-right: 3px;
.header-nav-folder-item {
 color: #fff ;
 border-top: 1px solid #b8b8b8;
 padding: 7px 0 !important;

.header-nav-folder-item a:hover {  

background: #77AF87;
 color: #fff !important;

Any help would be greatly appreciated!

Screen Shot 2020-03-05 at 5.58.36 PM.png

Link to comment
  • Replies 2
  • Views 2.7k
  • Created
  • Last Reply


This topic is now archived and is closed to further replies.

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.