Sembolün bozuk Yanlış CSS

Question

Sanırım çok kolay bir şeyle ilgileniyorum ama problemi bulamıyorum. On

benim Böyle koduna sahip görünüm oluşturma:

.required:after{ 
    content: "*"; 
    font-weight: bold; 
    color: red; 
} 

: Bir css sınıfı adı burada required denilen ve sahip 2 div Asistan

<div class="form-group"> 
     @Html.LabelFor(model => model.Total, htmlAttributes: new { @class = "control-label col-md-2" }) 
     <div class="col-md-10 required"> 
      @Html.EditorFor(model => model.Total, new { htmlAttributes = new { @class = "form-control" } }) 
      @Html.ValidationMessageFor(model => model.Total, "", new { @class = "text-danger" }) 
     </div> 
    </div> 

bu konuda gözlük vardır

Şimdi burada nasıl işlenir:

Kırmızı yıldız işaretini metin kutusundan hemen sonra nasıl görüntüleyebilirim? CSS'mde neyi özlüyorum?

Answer 1

ben bunu çözmüş olmasının .required:before

.required:before{ 
    content: "*"; 
    font-weight: bold; 
    color: red; 
    float:left; 
} 
#input{ 
    float:left; 
} 

Answer 2

kullanın.

CSS:

.required:after{ 
content: "*"; 
font-weight: bold; 
color: red; 
float:left; 
margin-left: 5px; 
} 

#input{ 
    float:left; 
} 

HTML:

<div class="form-group"> 
     @Html.LabelFor(model => model.Total, htmlAttributes: new { @class = "control-label col-md-2" }) 
     <div class="col-md-10 required"> 
      @Html.EditorFor(model => model.Total, new { htmlAttributes = new { @id = "input", @class = "form-control" } }) 
      @Html.ValidationMessageFor(model => model.Total, "", new { @class = "text-danger" }) 
     </div> 
</div>