Setting font color inside button not working

Question

I am having some trouble styling my buttons here. I am relatively new to this so I am sure it has something to do with my selectors. I am trying to set the font to white of the button that has the class 'active'. Both buttons have a grey font as if they contained inactive. My code is as follows:

<div class="form">
        <ul class="tab-group">
            <button class="active" type="button" id="btn-show-login">Log In</button>
            <button class="inactive" type="button" id="btn-show-signup">Sign Up</button>
        </ul>
...
</div>

.tab-group {
    ...
    .active button {
          background:$main;
          color:$white;
     }
}

Answer 1

Try button.active and it will work!