Question

我有两个下拉列表，按钮在列中的每个旁边对齐。我在第一列中显示下拉列表/按钮组合时遇到了一个奇怪的问题。

按钮“丢失”第一列中的右边框。我想也许这两者之间有一些不同之处，所以我把右边的那个（显示正确）切换到左边的那个。切换后，它现在缺少右边框，因此问题似乎与列有关，但列是相同的。以下是两个下拉列表的HTML：

<telerik:RadAjaxPanel ID="RadAjaxPanel1" EnableOutsideScripts="true" runat="server" LoadingPanelID="RadAjaxLoadingPanel1" BackColor="White">
<div class="form-group" runat="server" id="EmployeePicker" visible="true" style="background-color:white !important">
    <div class="row" >
        <div class="col-sm-12 col-md-4">
            <div class="input-group">
                <span class="input-group-addon input-group-btn" style="background-color:white !important;border:none">
                    <asp:DropDownList ID="ddlEmployee" runat="server" CssClass="form-control" AutoPostBack="true" OnSelectedIndexChanged="ddlEmployee_SelectedIndexChanged"></asp:DropDownList>
                    <span class="tool-tip" data-toggle="tooltip" data-placement="right" title="Configure employee permissions."><button id="btnEmployeeConfig" class="btn btn-default" runat="server" onclick="javascript:OpenModal('copyEmployeeModal')"><i class="s7-config" style="font-size:x-large;"></i></button>
                        </span>
                </span>
            </div>
        </div>
        <div class="col-sm-12 col-md-4">
            <div class="input-group" style="background-color:white !important;border:none">
                <span class="input-group-addon input-group-btn" style="background-color:white !important;border:none">
                    <asp:DropDownList ID="ddlEmployeeSiteGroup" runat="server" CssClass="form-control" AutoPostBack="false" Enabled="false"></asp:DropDownList>
                    <span class="tool-tip" data-toggle="tooltip" data-placement="right" title="Configure group permissions."><button id="btnEmployeeGroupConfig" class="btn btn-default" runat="server" onclick="javascript:OpenModal('copyEmployeeGroupModal')"><i class="s7-config" style="font-size:x-large"></i></button>
                    </span>
                </span>
            </div>
        </div>
    </div>
</div>
<div class="form-group" runat="server" id="SiteGroupPicker" visible="false">
    <div class="col-sm-12 col-md-4">
        <div class="input-group">
            <span class="input-group-addon input-group-btn"><asp:DropDownList ID="ddlSiteGroup" runat="server" CssClass="form-control" AutoPostBack="true" OnSelectedIndexChanged="ddlSiteGroup_SelectedIndexChanged"></asp:DropDownList><button class="btn btn-default" id="btnGroupConfig" runat="server" onclick="javascript:OpenModal('configGroupModal')"><i class="s7-config" style="font-size:x-large"></i></button>
            </span>
        </div>
    </div>

</div>

非常感谢任何帮助！

Answer 1

从第

行删除border:none

<span class="input-group-addon input-group-btn" style="background-color:white !important;border:none">

按钮与Dropdownlist在列中缺少边框对齐

1 个答案: