Hello,
Am new in CSS
I have form like below code.
<div>
<span class="lable"> Practice Name<span class="PreRequired">*</span></span>
<input type="text" name="practiceName" ng-model="practiceData.practiceName" style="width:20.5%;" required ng-pattern="/^([a-zA-Z]+\s*)*[a-zA-Z]+$/" placeholder="Practice Name"/>
<span ng-show="SubmitPractice.practiceName.$error.pattern">
Please enter valid Practice Name
</span>
</div>
<div>
<span class="lable"> Practice Head<span class="PreRequired">*</span></span>
<select ng-model="practiceData.practiceHead" style="width:20.5%;" required="required" ng-options="em.gslab_id as em.employee_name for em in userrole" >
<option style="display:none" value="">Select Practice Head</option>
</select>
<span style='color:red' ng-show="practiceData.practiceHead==='' && (practiceData.practiceExecs+'').length>0">
Please select Practice Head
</span>
</div>
In above, I have class="lable". I have applied CSS to that class like aligning and other needed things.I have used this class in lable.
I have another class="required".which I have used for input,select which marks red outline for input area.
I want to add * character after my lable (in above casees lables like Practice Name,Practice Head) , which I am doing by addng it explicitly using <span class="PreRequired">*</span>
Is it possible using CSS, that * get added to lable span as I use required class to any div?