html label:after content needs to have different colors in the text
<p>I have the display name of my model properties set, but I need them to display with a colon if they're not required and a colon and a red asterisk if they are. </p>

<p>I didn't want to add the colon to the display name since I don't want the colon to appear in error messages and I may want to display them somewhere without it. </p>

<p>I used the following style in my HTML file for adding the colon:</p>

<pre class="lang-css prettyprint-override"><code>.my-label &gt; label:after {
        content: ": ";
}
</code></pre>

<p>However I can't figure out how to get a red asterisk to display after that if the field is required.</p>

<p>I could create another style class to include the asterisk, however if I change the color it's either all red or all black. I'm not sure I want to set the actual model property to be required because I'm not sure I want a universal rule stating that it is required.</p>

<p>Any suggestions of a better way to handle this would be welcome.</p>