twitter bootstrap 3 - How to vertically align radio buttons -
i have following markup:
<div class="container-fluid"> <h2>transfer options:</h2> <div class="row well-sm"> <div class="col-xs-6"> <div id="sendtyperadio" class="btn-group-vertical" > <span class="input-group-addon"> <input id="radioemail" type="radio" name="sendtype" value="email" disabled>email </span> <span class="input-group-addon"> <input id="radioattachments" type="radio" name="sendtype" value="attachments" disabled>attachments </span> <span class="input-group-addon"> <input id="radioboth" type="radio" name="sendtype" value="both" disabled>email , attachments </span> </div><!-- /input-group --> </div><!-- /.col-xs-6 --> </div> </div>
the problem buttons next each other on x-axis. have been changing things day. moving out of row tag , in, removing formatting , such. want maintain input-group-addon styling, want each button on new row. i've searched , found nothing, clues?
in asking question came crappy answer:
<div class="container-fluid"> <h2>transfer options:</h2> <div class="row well-sm"> <div class="col-xs-6"> <div id="sendtyperadio" class="btn-group-vertical" > <div class="row"> <div class="col-xs-2"> <span class="input-group-addon"> <input id="radioemail" type="radio" name="sendtype" value="email" disabled>email </span> </div> </div> <div class="row"> <div class="col-xs-2"> <span class="input-group-addon"> <input id="radioattachments" type="radio" name="sendtype" value="attachments" disabled>attachments </span> </div> </div> <div class="row"> <div class="col-xs-2"> <span class="input-group-addon"> <input id="radioboth" type="radio" name="sendtype" value="both" disabled>email , attachments </span> </div> </div> </div><!-- /input-group --> </div><!-- /.col-xs-6 --> </div>
this gives me each item on new row absolutely ruins styling of bootstrap radio buttons
Comments
Post a Comment