1👍
✅
The specificity of your .focus
selector there is likely to be weaker than the other styling, so it is overridden by the later .bg-gray-200
.
Try moving the focus styling to a &.focus
block inside the tr {
block, after the other @apply
.
It might also just be that you are missing a closing brace for the tr block, and did not intend to apply the overriding style (as suggested by the indentation):
tr {
&:nth-child(2n) {
@apply .bg-white;
}
&:hover {
@apply .bg-gray-400;
}
} <-- is this brace missing?
Source:stackexchange.com