CSS help - on MetaFilter!

August 2, 2019 1:26 PM

I'm trying to make this all hyperlinks custom style and this just plus & minus sign custom style both work so the plus & minus signs are larger than the other hyperlinks. But it seems the former is winning and the plus/minus sign style doesn't work at all when the all-links one is active. How can I make both work?

I'm also comfortable doing this in Greasemonkey with JavaScript if that's easier.

The extension I'm using is Stylus since Stylish is spyware now.

posted by Tehhund to Computers & Internet (5 answers total)

If you update the plus/minus style to this, it should work:

@document domain("metafilter.com")
{
  [id^="plusminus"]
  {
    font-size: 200% !important;
  }
}

(if the code above got its formatting stripped, here's the pastebin: https://pastebin.com/ZuwCjKEV )
posted by Aleyn at 1:37 PM on August 2, 2019 [1 favorite]

Best answer: Making the selector more specific instead should work too: a:link[id^="plusminus"]
posted by one for the books at 4:37 PM on August 2, 2019 [1 favorite]

Response by poster: Awesome. Both work, but one for the books avoids the unfortunate !important.
posted by Tehhund at 5:07 PM on August 2, 2019

Response by poster: Update: the Stylish extension has spyware and the Stylish extension is a performance nightmare and battery hog. So I switched to a Greasemonkey script. But this still helped me get the selector right in that script, so thanks again.
posted by Tehhund at 8:55 AM on September 13, 2019

Response by poster: Er, the Stylus extension is a performance nightmare and battery hog.
posted by Tehhund at 10:05 AM on October 2, 2019