Onay Kutusunu Sağa Hizala

Question

Onay kutusunu, yinelenen ancak çalışmayan sağ tarafında hizalamaya çalışıyorum. Elemanları incelemeyi denedim ve farklı yollar denedim ama yine de sağa gitmek için onu alamıyorum.

<div class="container"> 
    <div class="row center"> 
    <p>Recurring:</p> 
    <form action="#"> 
     <input type="checkbox" id="check1"> 
     <label for="check1"></label> 
    </form> 
    </div> 
</div> 

Answer 1

form elemanının özelliği display:inline-block; sizin p elemanı verin ve.

P ve form öğelerinin her ikisi de varsayılan olarak display:block; özelliğine sahiptir.

p{ 
 
    display:inline-block; 
 
} 
 
form{ 
 
    display:inline-block; 
 
}

<div class="container"> 
 
    <div class="row center"> 
 
    <p>Recurring:</p> 
 
    <form action="#"> 
 
     <input type="checkbox" id="check1"> 
 
     <label for="check1"></label> 
 
    </form> 
 
    </div> 
 
</div>

Answer 2

Yoksa etikete elemanları inline hizalamak like this

<div class="container"> 
    <div class="row center"> 
    <form action="#"> 
     <label for="check1">Recurring</label> 
     <input type="checkbox" id="check1"> 
    </form> 
    </div> 
</div> 

Answer 3

kullanın inline-block div'leri senin "Dönüşümlü" metin ekleyebilirsiniz:

https://jsfiddle.net/Bendrick92/0o6mwdtz/

.left, .right { 
 
    display: inline-block; 
 
}

<div class="container"> 
 
    <div class="row center"> 
 
    <div class="left"> 
 
     <p>Recurring:</p> 
 
    </div> 
 
    <div class="right"> 
 
     <form action="#"> 
 
      <input type="checkbox" id="check1"> 
 
      <label for="check1"></label> 
 
     </form> 
 
    </div> 
 
    </div> 
 
</div>