Measurement Widget

[jaykapalczynski]

I am using the example for the measure widget  Measurement | ArcGIS API for JavaScript‌

I am taking it out of the Title pane and setting the color to white.  ALTHOUGH the text on the drop down that denotes (Acres, Sq Ft etc) stays BLACK

How can I change that drop down text to WHITE

Thoughts?

<div id="measurementDiv"></div>

<span style="font-size:smaller;padding:5px 5px;">Press <b>CTRL</b> to enable snapping.</span>

#measurementDiv{

  color: white;

}

[TimWitt2]

Try this and see what it does:

 .dijitMenuItem TD{
        color: white;
    }

Hope this helps!

[KenBuja · Accepted solution]

If I ever want to see the css and html for an object, I use Chrome's Developer tool called "Inspect Element" by right-clicking on an object.

In the example below, I inspected the text element and added a new color to the .dijitButtonText (highlighted in yellow) to change the color of the text.

[TimWitt2]

Ken is right, with my code you will only change the color of the dropdown text, which you probably want to change as well.

[TimWitt2]

Ken,

I just realized that this will change the color of all button text.

Write it like this so only the button text for the measure will be changed:

   #measurementDiv .dijitButtonText {
        color: white;
    }

Tim

[KenBuja]

Good catch, Tim!

[jaykapalczynski]

Im trying that with the Developer Tools and not getting to where you are....wonder what I am doing wrong

I thank you both for your thoughts....going to add that CSS, but really trying to figure out how you got to that in your image...I cant seem to get there.

[KenBuja]

You have to make sure the mouse is directly over the object you want to inspect. Sometimes it's difficult to get the right object, depending on how everything is laid out.

[jaykapalczynski]

Thanks Ken....was able to see that now...very useful....