How Do I Change Color of Date in this Google Page? Simple Request

Hi guys... Take a look at the attached screen shot. Circled in red is the date in google I want to change to white. I tried using "span" but that code is too general and can affect other fonts. Whats the exact code to change this?

The URL in google for this is here:
https://www.google.com/search?q=Replicel&ie=utf-8&oe=utf-8

.
1920 x 1080 - 434K

Comments

  • edited November 2017 Firefox
    Okay, Google's class names could be random gibberish, but right now, for me, this works:
      .kno-fv > br + span {
    color: blue !important;
    }
    It uses the parent element's class name, and the previous element (<br>) to specifically identify that second span using an adjacent sibling selector (+).

    Edit: I tested with blue because I have a white page background...
  • edited November 2017 Chrome
    Jefferson said:



      .kno-fv > br + span {
    color: blue !important;
    }
    Hi jefferson.. Thanks that works. How did you get to that code?
  • https://www.w3schools.com/cssref/css_selectors.asp
    image

    You can also make this in that way:
    span[style="font-size:11px;padding-top:3px;color:#777"] {
    color: red !important;
    }
    but better use Jefferson code
  • How did you get to that code?

    Using the inspector (right-click > Inspect Element) I could see it was a span that didn't have any of its own unique identifiers, so I looked at its parent element. The parent contains multiple spans, so I had to find a way to target just the one. It is the only one with a br element just before it, so that is the formula: use a regular selector for the br element, then a + to select its adjacent "sibling".
  • Jefferson said:

    How did you get to that code?

    Using the inspector (right-click > Inspect Element) I could see it was a span that didn't have any of its own unique identifiers, so I looked at its parent element. The parent contains multiple spans, so I had to find a way to target just the one. It is the only one with a br element just before it, so that is the formula: use a regular selector for the br element, then a + to select its adjacent "sibling".
    I wish I knew how you did this because I tried seeing what you're seeing on my end with inspector. But I cant see it.

    Anyway I got another small issue. For this, search "ambien" in google. Please look at the screen shot. Circled in red are dots that indicate the mini page you're on. How can I color both of these dots?

    Thanks for your help also Pabli !!


    1920 x 1080 - 188K
  • edited November 2017 Firefox

    For this, search "ambien" in google. Please look at the screen shot. Circled in red are dots that indicate the mini page you're on. How can I color both of these dots?

    The Inspector shows this HTML for the two dots:
    <div class="_SRk">
    <div class="_xOk imOkwAL_k_Uw-maqlHhs-I4g t7iPNCE6YvC__selected"></div>
    <div class="_xOk imOkwAL_k_Uw-maqlHhs-I4g"></div>
    </div>
    There is a base background color, and then a different background color for the one with __selected in the class name. You could try:
      ._SRk > div { background-color: #888 !important; }
    ._SRk > div[class*="__selected"] { background-color: #eee !important; }
    Again, this assumes the _SRk class name is stable. Which I do not know.
  • Hi Jefferson,

    Thanks man.. that worked perfectly!
Sign In or Register to comment.