Skip to main content
2 de 2
eliminar etiqueta "symfony". Es irrerevante para la pregunta
user avatar
user avatar

Como alinear los 2 input radio button a la derecha

Como puedo alinear los inputs radio button utilizando semantic ui:

body { background-color: #fefefe !important; font-size: 9px !important;}

.navbar-nav > li > a { font-size: 13px; }

/* PASOS */
.item-flow{
    text-align: center;
    border-style: none;
    background-color: #e4e7ea !important;
    border-bottom: 5px solid #d3d6d9;
    padding: 2px;
    padding-top: 10px;
    font-size: 15px;
}

.steps li{
    border-style: none;
}

.steps{
    text-align: center;
    background-color: #e4e7ea;
    border-bottom: 5px solid #d3d6d9;
}

.step-selected{
    color: #1abc9c !important;
    border-bottom: 5px solid #1abc9c;
}

.step-backon{
    color: #999;
    border-bottom: 5px solid #1abc9c;
}

.ui.steps .step.active .title {
  color: #00B5AD;
}

/* PROCESS HOME */
.proceso {
    height: 80px;
    background-color: #e4e7ea !important;;
}

.item-proceso {
    text-align: center;
    border-style: none;
    background-color: #e4e7ea !important;
    padding: 2px;
    padding-top: 10px;
    font-size: 15px;
    height: 80px;
}

.img-zoom {
    position: relative;
    top: 0;
    left: 0;
    -webkit-transition: 0.6s ease;
  transition: 0.6s ease;
}

.img-zoom:hover {
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
}



.item-proceso > span { color: #1abc9c !important; }
.item-next-proceso {
    text-align: center;
    border-style: none;
    background-color: #e4e7ea !important;
    border-bottom: 5px solid #1abc9c;
    padding: 2px;
    padding-top: 10px;
    font-size: 15px;
    height: 35px;
}

/* LEFT BAR */
.leftbar {
    background: rgba(224,251,255,1);
    background: -moz-linear-gradient(top, rgba(224,251,255,1) 0%, rgba(126,209,224,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(224,251,255,1)), color-stop(100%, rgba(126,209,224,1)));
    background: -webkit-linear-gradient(top, rgba(224,251,255,1) 0%, rgba(126,209,224,1) 100%);
    background: -o-linear-gradient(top, rgba(224,251,255,1) 0%, rgba(126,209,224,1) 100%);
    background: -ms-linear-gradient(top, rgba(224,251,255,1) 0%, rgba(126,209,224,1) 100%);
    background: linear-gradient(to bottom, rgba(224,251,255,1) 0%, rgba(126,209,224,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0fbff', endColorstr='#7ed1e0', GradientType=0 );
}

.img-cover {
  object-fit: cover;
  width: auto;
  height: 200px;
}

.leftbar .img{
  background-image: url('https://cdn-images-1.medium.com/max/2000/1*ULAxhomRYK83uTAFf-acRg.jpeg');
  background-size: 130%;
  object-fit: cover;
  height: 150px;
  width: 100%;
  
  text-align: center;
}

.leftbar-link{
  
  text-shadow: rgb(0,0,0);
}

.stripe-submit{
  background-image: none !important;
  background-color: #1abc9c !important;
}

.stripe-submit span{
  background-image: none !important;
  background-color: #1abc9c !important;
}
/* ********** FIX NAVBAR MENU ON MOBILE ****************/
.mobile-navbar { display:  none !important; }
#main_body { backgroun-color: #fff !important; }
@media only screen and (max-width: 700px) {
  .desktop-navbar {
      display: none !important;
  }
  
  .mobile-navbar {
      display: block !important;
  }
}
<html>

<head>
  <link rel="stylesheet" type="text/css" href="https://semantic-ui.com/dist/semantic.min.js">
  </script>
  <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
  <script src="https://semantic-ui.com/semantic/dist/semantic.min.js"></script>
</head>


<body id="main_body">

  <div class="pusher">
    <div class="ui vertical center aligned segment">
      <div class="ui container">
        <form class="ui form">
          <div class="fields">
            <div class="field">
              <label>* Has a Certified Copy of the Birth Registration been previously issued for this birth?</label>
            </div>
            <div class="field">
              <div class="ui radio checkbox">
                <label>Yes</label>
                <input required type="radio" name="birth-reg-previously-issued" value="yes">
              </div>
            </div>
            <div class="field">
              <div class="ui radio checkbox">
                <label>No</label>
                <input required type="radio" name="birth-reg-previously-issued" value="no">
              </div>
            </div>
          </div>
        </form>


      </div>
    </div>
  </div>
</body>

</html>