Yes this should work. Don't forget you also need to compile the scss file to css. 

If you want to add a $ before text, I think it is better to do content: ‘$ ‘ ;  (so with a space), instead of moving it to the left 5px. If you have a very large (or very small font), the space between your text and the dollar-sign could look awkward. 

It will work but have your editor fix the layout (Shift+Alt+F in Visual\studioCode)

Does anyone know how to prevent the $ from appearing next to the data grid label? I saw some post mentioning using “tbody,” but that didn’t seem to work.

Illustration of problem – the dollar signs are floating above the data grid and also next to the data grid headers. As far as which level I added the class, besides the original screenshot above, I applied the class on the data grid object. Does this help answer the question? Appreciate any tips!

Is this correct? Now the $’s aren’t showing at all … Sorry again for the simple question, but I’m unfamiliar with HTML

That is working for me now (all data grid columns show the $), and I’ve been reading up on CSS. What I'm still unsure about is how to override a column in the datagrid/table so that it doesn’t show the $. Any tips?

Figured it out using the class below from a different post, and applied to data grid column instead of a class to the entire grid:

.dollarsign label:before, .dollarsign .mx-datagrid-data-wrapper:before {
  content: "$";
  padding-right: 3px;
}