Question

输入组不会向右移动并保持格式正确

<div>
    <span id="input-group" class="pull-right" style="margin-right: 20px;">
    </span>
    <class="input-group">
    <span class="input-group-btn">
        <button type="button" class="btn btn-danger btn-number"  data-type="minus" 
data-field="quant[2]">
            <span class="glyphicon glyphicon-minus"></span>
        </button>
    </span>
    <input type="text" name="quant[2]" class="form-control input-number" 
value="10" min="1" max="100">
    <span class="input-group-btn">
    <button type="button" class="btn btn-success btn-number" data-type="plus" 
data-field="quant[2]">
        <span class="glyphicon glyphicon-plus"></span>
    </button>

Answer 1

使用方向 propirty来更改所有元素的浮动

<div class="col-md-12">
    <div style="direction:rtl;">
    <span id="input-group" class="pull-right" style="margin-right: 20px;">
    </span>
    <class="input-group">
    <span class="input-group-btn">
    <button type="button" class="btn btn-danger btn-number"  data-type="minus" 
    data-field="quant[2]">
    <span class="glyphicon glyphicon-minus"></span>
    </button>
    </span>
    <input type="text" name="quant[2]" class="form-control input-number" 
    value="10" min="1" max="100">
    <span class="input-group-btn">
    <button type="button" class="btn btn-success btn-number" data-type="plus" 
    data-field="quant[2]">
    <span class="glyphicon glyphicon-plus"></span>
    </button>
</div>
<div>

Answer 2

<html>
<head>
<title>
</title>

<script
  src="https://code.jquery.com/jquery-3.2.1.js"
  integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE="
  crossorigin="anonymous"></script>
  <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<body>
<div class="col-md-12">


<div class="col-md-12">
    <div class="pull-right" style="direction:rtl;">
    <span id="input-group"  style="margin-right: 20px;">
    </span>
    <class="input-group">
    <span class="input-group-btn">
    <button type="button" class="btn btn-danger btn-number"  data-type="minus" 
    data-field="quant[2]">
    <span class="glyphicon glyphicon-minus"></span>
    </button>
    </span>
    <input type="text" class="form-control input-number">
    <span class="input-group-btn">
    <button type="button" class="btn btn-success">
    <span class="glyphicon glyphicon-plus"></span>
    </button>
</div>
<div>

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

Bootstrap Snippet“按钮减去输入中的加号”将不会向右移动

2 个答案: