Question

您好我有以下html文件，其中包含3个输入选项。如下

{{1}}

但是输入组插件没有对齐。尝试使用CSS对齐，但未能这样做。如何对齐此输入组插件？有什么建议吗？提前致谢。

Answer 1

然后解决方案就在你的HTML

中

每个标签及其父标签必须位于表格单元格
每个输入选项及其父级必须位于表格单元格

这是一个代码段（为所有td添加边框并查看对齐方式）

<script type="text/ng-template" id="dashboard_assigngroup_popup.html"></script>
    <div class="modal-header modal-header2">
        <h3 class="modal-title">Assign Chart Group</h3>
    </div>

    <div class="modal-body">
        <table class="table">
            {%verbatim %}

            <tr>
                <td class="input-group" style="padding:1%;">
                <span class="input-group-addon">Chart title</span>
                        
                </td>
                <td>
                <select type="input" class="form-control" ng-model="final_data.info" ng-options="m.id as m.title for m in chartlist" required ng-cloak></select>
                </td>
            </tr>
            <tr>
            <td>
              <span class="input-group-addon">Chart group</span>
              </td>
            <td>
              <select  class="input-group" style="padding:1%;"> </select>
            </td>  
            </tr>
            <tr>
                <td>
                    <div class="input-group" style="padding:1%;"></div>
                        <span class="input-group-addon">Order </span>
                </td>
                <td>
                  <input type="input" class="form-control" placeholder="Order" ng-model="final_data.orderg">
                </td>                
            </tr>

            <tr>
                <td colspan="4">
                    <div class="modal-footer">
                        <button class="btn btn-success" type="button" ng-click="submit()" id="submit">Save</button>
                        <button class="btn btn-grey" type="button" ng-click="cancel()">Discard</button>
                    </div>
        </table>
        {% endverbatim %}
    </div>

</script>

如何对齐input-group-addon的宽度

1 个答案: