Tab button only works if clicked on the top half

Site URL: https://insidejobleaders.com/programs

Hello! 

My first attempt at creating a website with no background in coding.

I followed some tips online on how to create a tab section and it worked out well. However, in order to select a tab you have to click on the top half of the button. What do i adjust to make it so the whole button is clickable?

Thank you!

https://insidejobleaders.com/programs

Password: Liza

Which code did you use? Can you post here?

Hi tuanphan!

i used: https://www.will-myers.com/articles/adding-simple-tabs-to-your-website-in-squarespace-71-and-70

CSS: 

.tabs-container{
  transform:translateY(100%);
  width:100% !important;
  text-align:center;
  border-bottom: 1px solid #999;
  overflow: auto;
  overflow-x:auto;
  white-space: nowrap;
  z-index:99;
}
.tab-btn{
  max-width:150px;
  display: inline-block;
  border-radius:3px 3px 0 0;
  border:1px solid #999;
  padding: 12px 18px;
  font-size:1.2em;
  background:white;
  margin-bottom:none !important;
  border:none !important;
  &:not(:first-of-type){
  margin-left:10px;    
  }
}
.tab-btn.active{
  background:lightblue;
}

.tab-section-hide{
  display:none;
}
.tab-section-show{
  display:block;
}

Hi. Missing your comment. Above link doesn't exist.

You can also use this plugin to create Tabs (&accordion), easy to install/customize without coding skills.