Style type text/css over riding element?

Wolf_knightWolf_knight
edited July 2015 in Style Development Firefox
In my theme BM Ebay I can set p.p1 to be a color other than black but it does not change. After going through the code and deleting random stuff to figure out the cause I discovered the culprit was the element above it:
"Style type="text/css""

http://s10.postimg.org/5kh3obm49/wtf.png

Which sets the text of p.p1 to be #000 in plain text. Is there any way to change the color of p.p1 with stylish or will the seller description box be gone forever requiring me to delete the theme to avoid people buying stuff on accident?

Comments

  • anagrammaranagrammar
    Chrome
    A link to a page with the element and a pic of where it's located would help.
  • LouCypherLouCypher
    Safari

    Use CSS specificity.
    For example (from your screenshot)

    style + p.p1 { color: #F00; }

    or use 'lazy mode'

    p.p1 { color: #F00 !important; }

  • Wolf_knightWolf_knight
    Firefox
    anagrammar said:

    A link to a page with the element and a pic of where it's located would help.

    I did include a picture of it, and I mentioned it was p.p1 on ebay which is the product description, but here you go:
    http://www.ebay.com/itm/331594937985?_trksid=p2060353.m2749.l2649&ssPageName=STRK:MEBIDX:IT

    If you notice after the detailed item info box it should say "Case, disc and manual only. No insert. Tested and working" but no matter what I do I can not change the color of that text.


    @Lou I tried p.p1 using important already and it did nothing. And following your suggestion I also quoted your first code block and that did nothing as well.
  • anagrammaranagrammar
    Chrome
    It's in an iframe, add domain "ebaydesc.com".
  • anagrammaranagrammar
    Chrome
    BTW, I meant a pic of the element itself (not devtools).
  • hideheaderhideheader
    edited July 2015 Firefox
    Wolf_knight said:

    I tried p.p1 using important already and it did nothing.

    That element is probably in an IFRAME. Right-click and Inspect Element, then work your way up the DOM until you find the IFRAME. Copy its src and paste it into a new @document rule and pop your original rule inside it: 
    @-moz-document url( [IFRAME src URL] ) {
      p.p1 {color: #000}
    }
    Did it work? Then now comes the tricky part: You've got to rewrite the new @-moz-document rule for that URL and all its brethren. (Grr!)

    ...Oh, and the screenshot of Inspector is exactly what was wanted here. And, if you haven't already done it, in the Developer Tools preferences (click the "gear" icon at the top right) enable "Inspector > Show Browser Styles" so you can see the Stylish rules, too.
  • makondomakondo
    edited July 2015 Firefox
    .
  • anagrammaranagrammar
    Chrome
    hideheader said:

    That element is probably in an IFRAME.

    It is. I said that already.
    hideheader said:

    ...Oh, and the screenshot of Inspector is exactly what was wanted here.

    It doesn't hurt, but it doesn't help me follow the link and quickly find the element either.

    If you guys want to give him instructions on how to do it himself, that's great, but adding "ebaydesc.com" as a domain eliminates the "tricky part". It's broad enough to cover all your bases and specific enough to have no adverse effects.
  • Wolf_knightWolf_knight
    Firefox
    would you mind telling me why ebaydesc.com works? I would like to know what I'm dealing with here in case I encounter it again.
  • anagrammaranagrammar
    Chrome
    An iframe is essentially a page within a page, and and unless the iframe is covered by the @-moz-document, Stylish treats it as a separate page. Follow hideheader's instructions to learn how to do it yourself.
  • Wolf_knightWolf_knight
    Firefox
    Okay, one thing I don't understand though is why it didn't work with "@-moz-document url( [IFRAME src URL] )" but it did work with "@-moz-document url-prefix([IFRAME src URL] )"
  • anagrammaranagrammar
    Chrome
    There's dynamic elements to the url's. They change slightly. You want to be as broad as possible to include all similar iframes, but not so broad that it affects iframes on unintended domains. A lot of times this requires latching on to a specific part of the url that is unique to that domain via regex. In this particular case I think it's highly unlikely that "ebaydesc.com" will be used elsewhere, so including it as a domain is probably the way to go.
Sign In or Register to comment.