Padding und Klasse col-md funktioniert nicht

Question

Ich versuche, meine Radio-Taste für diesen bestimmten Teil für eine lange Zeit nach rechts zu verschieben, und es funktioniert immer noch nicht, ich versuche Padding und Klasse col-md dafür und überprüfe auch, ob mein Tag geschlossen ist, aber es bewegt sich immer noch nicht nach rechts. Kann mir jemand bei diesem Problem helfen? Danke im Voraus.

test.blade.php

<div class="form-group"> 
    <label class="col-md-2"><b>Residential Status:</b></label> 
     <div class="col-md-8"> 
     <input type="radio" name="residential_status" value="Local" required> Local<br> 
     <input type="radio" name="residential_status" value="Overseas" required> Overseas<br> 
     </div> 
    </div> 
     <div class="form-group"> 
     <div class="editfield1"> 
     <div class="radio"> 
      <div id="chkNRICid1"> 
      <label style="font-weight: bold">Do you have a NRIC?</label> <br/> 
       <input type="radio" name="NRIC_check" id="nricid1" value="Yes" onclick="document.getElementById('NRIC_check').style.display='block'" required> Yes <br> 
       <input type="radio" name="NRIC_check" id="nricid2" value="No" onclick="document.getElementById('NRIC_check').style.display='none'" required> No 
      </div> 
     </div> 
     </div> 

     <div class="editfield1" id="NRIC_check" style="display:none"> 
     <label for="NRIC_check"> Type your NRIC/FIN number:</label> 
       <label><input type="text" name="nric_number1" id="nric_number1"> </label> 
     </div> 
     </div> 

Dies ist der Screenshot von dem, was geschieht: (ich es wie die Aufenthaltsstatus sein wollen)

Answer 1

So viele unberechenbaren und nicht benötigte divs Sie zusammen los mit Befestigungs Ihre Verschachtelung erhalten kann, danach ist es nur eine Frage der im Anschluss an die Struktur in dem ersten Teil der Vorlage:

<div class="form-group"> 
    <div class="col-md-2"> 
     <label>Residential Status</label> 
    </div> 
    <div class="col-md-10"> 
     <label><input type="radio" name="residential_status" value="Local" required> Local</label> 
     <br /> 
     <label><input type="radio" name="residential_status" value="Overseas" required> Overseas</label> 
    </div> 
</div> 
<div class="form-group"> 
    <div class="col-md-2"> 
     <label>Do you have a NRIC?</label> 
    </div> 
    <div class="col-md-10"> 
     <label><input type="radio" name="NRIC_check" id="nricid1" value="Yes" onclick="document.getElementById('NRIC_check').style.display='block'" required>Yes</label> 
     <br /> 
     <label><input type="radio" name="NRIC_check" id="nricid2" value="No" onclick="document.getElementById('NRIC_check').style.display='none'" required> No </label> 
    </div> 
</div> 
<div class="form-group" id="NRIC_check" style="display:none"> 
    <div class="col-md-2"> 
     <label>Type your NRIC/FIN number:</label> 
    </div> 
    <div class="col-md-10"> 
     <input type="text" name="nric_number1" id="nric_number1" /> 
    </div> 
</div> 

Answer 2

Wickeln Sie die beiden Eingänge innerhalb eines <div> und etwas Marge hinzufügen.

<div style="margin-left: 50px"> 
    <input ... /> 
    <input ... /> 
</div> 

Wenn Sie Bootstrap 4 verwenden könnten Sie auch:

<div class="ml-5">