2

I'm trying to write a user style for this page using Stylish in Firefox 27.0.1. The stylesheet I have so far is:

@-moz-document domain("www.hitbox.tv") {

/***** Change stream area colours *****/
.meta, /* title and tabs */
.userContent.cf /* share buttons */
{
    background: none !important; /* remove white gradient */
    background-color: #000 !important;
    color: #AAA !important;
    border-bottom: none !important; /* remove white separator */
}

.title, /* stream title */
.hover, /* tabs and buttons below title */
.profile *  /* profile text */
{
    color: #AAA !important;
}

.btns .active /* currently selected tab */
{
    color: #484 !important;
}

button {
    background:    #000 !important;
    color:         #AAA !important;
    border-top:    2px #AAA solid !important;
    border-right:  2px #AAA solid !important;
    border-bottom: 2px #888 solid !important;
    border-left:   2px #888 solid !important;
}


/***** Push video down the page *****/
.player {
    padding-top: 100px !important;
}

/***** Make video occupy all available space *****/
#player {
    width: 100% !important;
    /* height: 100% !important; */
}


} /* @-moz-document */

The issue is with the very last rule, that should affect the "follow" button below the stream title. (In my case it's a "following" button, but the rule should affect it either way.) None of the styles applied to it are having any effect. However if I comment out any one of the "border" styles, the other s(including "background" and "color") suddenly work. Specifying simply border: 2px #AAA solid !important; also causes the entire rule to be ignored. What's going on here?

Rena
  • 3,923
  • 3
  • 22
  • 19
  • What happens if you go more specific with your CSS selector? E.g. `button.btnBlue` or whatnot. – arandompenguin Mar 06 '14 at 00:18
  • 1
    What happens if you set `-moz-appearance: none` in your rule? – Boris Zbarsky Mar 06 '14 at 01:28
  • Interesting question. I can duplicate the behaviour and I don't know how it happens. Strange indeed. One of the stranger aspects about this is that if there's no user CSS at all, the button is blue. But if you set it to black, it becomes light grey. Even if there's nothing in the CSS that sets anything to light grey! – Mr Lister Mar 06 '14 at 09:38
  • The only explanation would be that there's Javascript somewhere that changes the color, if and only if the styles are like you set them. But I can't see where it does that. Or indeed, why it would do that in the first place. – Mr Lister Mar 06 '14 at 09:42

0 Answers0