我在ASP.NET 4.5网站上发生了一个非常奇怪的问题,使用bootstrap进行样式化。我已将控件的类设置为form-control-static
以进行对齐。但是,我在3个浏览器中获得了不同的显示结果。
IE9,我们的一些用户使用,控件在聚焦或鼠标悬停时发光。这很好。
Chrome,文本框边框在聚焦时会变为蓝色(但没有发光)。鼠标悬停没有任何反应(对我很好)。
IE11,这是该应用程序的主要使用浏览器,控件不会发光或改变焦点上的边框颜色。但是,如果我单击每个文本框然后选项卡到下一个文本框,则边框将变为蓝色仅标签到下一个字段。即使我浏览不同的字段,控件也会保持蓝色边界(请参见下面的屏幕截图)。如果我使用form-control
(非静态),我会得到漂亮的圆形控件,焦点上有蓝色光晕。但布局不是我想要的。
<div class="form-group">
<asp:Label ID="lblReduction" runat="server" Font-Bold="True" Text="Reduction:" Width="320px"></asp:Label>
<asp:DropDownList ID="ddlReduction" runat="server" AutoPostBack="True" CssClass="form-control-static" OnSelectedIndexChanged="ddlReduction_SelectedIndexChanged" Width="220px">
<asp:ListItem><-- Please Select --></asp:ListItem>
<asp:ListItem>Yes</asp:ListItem>
<asp:ListItem>No</asp:ListItem>
</asp:DropDownList>
</div>
<div class="form-group">
<asp:Label ID="lblDLACareComponentAward" runat="server" CssClass="form-control-static" Font-Bold="True" Text="DLA Care Component Payment Awarded (£):" Width="320px"></asp:Label>
<asp:TextBox ID="DLACareComponentAwardTextBox" runat="server" CssClass="form-control-static" MaxLength="8" Text='<%# Bind("DLACareComponentAward") %>' Width="220px" />
<asp:RequiredFieldValidator ID="reqvalDLACareAwarded" runat="server" ControlToValidate="DLACareComponentAwardTextBox" Display="Dynamic" Enabled="False" ErrorMessage="DLA Care Component Payment Required" font-bold="true" ForeColor="Red" SetFocusOnError="True">*</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="regexDLApaymentAwarded" runat="server" ControlToValidate="DLACareComponentAwardTextBox" Display="Dynamic" ErrorMessage="DLA Care Component Payment Awarded must be a money value" font-bold="true" ForeColor="Red" ValidationExpression="[0-9]+(\.[0-9][0-9]?)?" ValidationGroup="PIP">*</asp:RegularExpressionValidator>
</div>
<div class="form-group">
<asp:Label ID="lblDLAMobilityComponentAward" runat="server" Font-Bold="True" Text="DLA Mobility Component Payment Awarded (£):" Width="320px"></asp:Label>
<asp:TextBox ID="DLAMobilityComponentAwardTextBox" runat="server" CssClass="form-control-static" MaxLength="8" Text='<%# Bind("DLAMobilityComponentAward") %>' Width="220px" />
<asp:RequiredFieldValidator ID="reqvalMobilityComponent" runat="server" ControlToValidate="DLAMobilityComponentAwardTextBox" Display="Dynamic" Enabled="False" ErrorMessage="DLA Mobility Component Payment" font-bold="true" ForeColor="Red" SetFocusOnError="True" ValidationGroup="PIP">*</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="regexDLApaymentAwarded0" runat="server" ControlToValidate="DLAMobilityComponentAwardTextBox" Display="Dynamic" ErrorMessage="DLA Mobility Component Payment Awarded must be a money value" font-bold="true" ForeColor="Red" ValidationExpression="[0-9]+(\.[0-9][0-9]?)?" ValidationGroup="PIP">*</asp:RegularExpressionValidator>
</div>
<div class="form-group">
<asp:Label ID="lblDailyPIPPoints" runat="server" Font-Bold="True" Text="Daily PIP Points:" Width="320px"></asp:Label>
<asp:TextBox ID="DailyPIPPointsTextBox" runat="server" CssClass="form-control-static" MaxLength="10" Text='<%# Bind("DailyPIPPoints") %>' Width="220px" />
<asp:RequiredFieldValidator ID="reqvalDailyPIPPoints" runat="server" ControlToValidate="DailyPIPPointsTextBox" Display="Dynamic" Enabled="False" ErrorMessage="Daily PIP Points" font-bold="true" ForeColor="Red" SetFocusOnError="True" ValidationGroup="PIP">*</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="regexDailyPIP" runat="server" ControlToValidate="DailyPIPPointsTextBox" Display="Dynamic" ErrorMessage="Only numbers can be used for Daily PIP Points" font-bold="true" ForeColor="Red" ValidationExpression="^[0-9]*$" ValidationGroup="PIP">*</asp:RegularExpressionValidator>
</div>
<div class="form-group">
<asp:Label ID="lblMobilityPIPPoints" runat="server" Font-Bold="True" Text="Mobility PIP Points:" Width="320px"></asp:Label>
<asp:TextBox ID="MobililtyPIPPointsTextBox" runat="server" CssClass="form-control-static" MaxLength="10" Text='<%# Bind("MobililtyPIPPoints") %>' Width="220px" />
<asp:RequiredFieldValidator ID="reqvalMobilityPIPPoints" runat="server" ControlToValidate="MobililtyPIPPointsTextBox" Display="Dynamic" Enabled="False" ErrorMessage="Mobility PIP Points" font-bold="true" ForeColor="Red" SetFocusOnError="True" ValidationGroup="PIP">*</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="regexMobilityPIPPoints" runat="server" ControlToValidate="MobililtyPIPPointsTextBox" Display="Dynamic" ErrorMessage="Only numbers can be used for Mobility PIP Points" font-bold="true" ForeColor="Red" ValidationExpression="^[0-9]*$" ValidationGroup="PIP">*</asp:RegularExpressionValidator>
</div>
<asp:Panel ID="pnlPIP" runat="server" Visible="false">
<div class="form-group">
<asp:Label ID="lblPIPDailyLivingAward" runat="server" Font-Bold="True" Text="PIP Daily Living Award (£):" Width="320px"></asp:Label>
<asp:TextBox ID="PIPDailyLivingAwardTextBox" runat="server" CssClass="form-control-static" MaxLength="8" Text='<%# Bind("PIPDailyLivingAward") %>' Width="220px" />
<asp:RequiredFieldValidator ID="reqvalDailyLivingAward" runat="server" ControlToValidate="PIPDailyLivingAwardTextBox" Display="Dynamic" Enabled="False" ErrorMessage="PIP Daily Living Award Required" font-bold="true" ForeColor="Red" SetFocusOnError="True" ValidationGroup="PIP">*</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="regexDLApaymentAwarded1" runat="server" ControlToValidate="PIPDailyLivingAwardTextBox" Display="Dynamic" ErrorMessage="PIP Daily Living Awarded must be a money value" font-bold="true" ForeColor="Red" ValidationExpression="[0-9]+(\.[0-9][0-9]?)?" ValidationGroup="PIP">*</asp:RegularExpressionValidator>
</div>
<div class="form-group">
<asp:Label ID="lblPIPMobilityAward" runat="server" Font-Bold="True" Text="PIP Mobility Award (£):" Width="320px"></asp:Label>
<asp:TextBox ID="PIPMobilityAwardTextBox" runat="server" CssClass="form-control-static" MaxLength="8" Text='<%# Bind("PIPMobilityAward") %>' Width="220px" />
<asp:RequiredFieldValidator ID="reqvalmobilityAward" runat="server" ControlToValidate="PIPMobilityAwardTextBox" Display="Dynamic" Enabled="False" ErrorMessage="PIP mobility Award Required" font-bold="true" ForeColor="Red" SetFocusOnError="True" ValidationGroup="PIP">*</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="regexDLApaymentAwarded2" runat="server" ControlToValidate="PIPMobilityAwardTextBox" Display="Dynamic" ErrorMessage="PIP Mobility Award must be a money value" font-bold="true" ForeColor="Red" ValidationExpression="[0-9]+(\.[0-9][0-9]?)?" ValidationGroup="PIP">*</asp:RegularExpressionValidator>
</div>
</asp:Panel>
<asp:Panel ID="pnlAppealLodged" runat="server" Visible="false">
<div class="form-group">
<asp:Label ID="lblAppealLodged" runat="server" Font-Bold="True" Text="Appeal Lodged:" Width="320px"></asp:Label>
<asp:DropDownList ID="ddlAppealLodged" runat="server" AutoPostBack="True" CssClass="form-control-static" OnSelectedIndexChanged="ddlAppealLodged_SelectedIndexChanged" Width="220px">
<asp:ListItem Value="0"><-- Please Select --></asp:ListItem>
<asp:ListItem>Yes</asp:ListItem>
<asp:ListItem>No</asp:ListItem>
</asp:DropDownList>
</div>
</asp:Panel>
<asp:Panel ID="pnlAppealDate" runat="server" Visible="false">
<div class="form-group">
<asp:Label ID="lblAppealLodgedDate" runat="server" Font-Bold="True" Text="Date Appeal Lodged:" Width="320px"></asp:Label>
<asp:TextBox ID="txtDateLodged" runat="server" CssClass="form-control-static" Width="220px"></asp:TextBox>
<ajaxToolkit:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" runat="server" TargetControlID="txtDateLodged" WatermarkCssClass="txtwatermark" WatermarkText="dd/mm/yyyy" />
</div>
<asp:RegularExpressionValidator ID="regexDateAppealLodged" runat="server" ControlToValidate="txtDateLodged" Display="Dynamic" ErrorMessage="* Enter a valid Termination Date (DD/MM/YYYY)" font-bold="true" ForeColor="Red" ValidationExpression="^(((0[1-9]|[12]\d|3[01])\/(0[13578]|1[02])\/((19|[2-9]\d)\d{2}))|((0[1-9]|[12]\d|30)\/(0[13456789]|1[012])\/((19|[2-9]\d)\d{2}))|((0[1-9]|1\d|2[0-8])\/02\/((19|[2-9]\d)\d{2}))|(29\/02\/((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))))$" ValidationGroup="PIP">*</asp:RegularExpressionValidator>
</asp:Panel>
<div class="form-group">
<asp:Label ID="lblVSSInterest" runat="server" Font-Bold="True" Text="VSS Interest Confirmed:" Width="320px"></asp:Label>
<asp:DropDownList ID="ddlVSS" runat="server" AutoPostBack="True" CssClass="form-control-static" OnSelectedIndexChanged="ddlVSS_SelectedIndexChanged" Width="220px">
<asp:ListItem Value="0"><-- Please Select --></asp:ListItem>
<asp:ListItem>Yes</asp:ListItem>
<asp:ListItem>No</asp:ListItem>
</asp:DropDownList>
<div>
<br />
<asp:Panel ID="pnlCRIType" runat="server" Visible="false">
<div class="form-group">
<asp:Label ID="lblCRIType" runat="server" Font-Bold="True" Text="CRI Type:" Width="320px"></asp:Label>
<asp:DropDownList ID="ddlCRIType" runat="server" CssClass="form-control-static" Width="220px">
<asp:ListItem Value="0"><-- Please Select --></asp:ListItem>
<asp:ListItem>Psychological</asp:ListItem>
<asp:ListItem>Physical</asp:ListItem>
<asp:ListItem>Psychological & Physical</asp:ListItem>
<asp:ListItem>Other</asp:ListItem>
</asp:DropDownList>
</div>
</asp:Panel>
<div class="form-group">
<asp:Label ID="lblDLATerminationDate" runat="server" Font-Bold="True" Text="DLA Termination Date:" Width="320px"></asp:Label>
<asp:TextBox ID="DLATerminationDateTextBox" runat="server" CssClass="form-control-static" MaxLength="10" Text='<%# Bind("DLATerminationDate") %>' Width="220px" />
<ajaxToolkit:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender2" runat="server" TargetControlID="DLATerminationDateTextBox" WatermarkCssClass="txtwatermark" WatermarkText="dd/mm/yyyy" />
<asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" ControlToValidate="DLATerminationDateTextBox" Display="Dynamic" ErrorMessage="* Enter a valid Termination Date (DD/MM/YYYY)" font-bold="true" ForeColor="Red" ValidationExpression="^(((0[1-9]|[12]\d|3[01])\/(0[13578]|1[02])\/((19|[2-9]\d)\d{2}))|((0[1-9]|[12]\d|30)\/(0[13456789]|1[012])\/((19|[2-9]\d)\d{2}))|((0[1-9]|1\d|2[0-8])\/02\/((19|[2-9]\d)\d{2}))|(29\/02\/((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))))$" ValidationGroup="PIP">*</asp:RegularExpressionValidator>
<asp:RequiredFieldValidator ID="reqvalTerminationDate" runat="server" ControlToValidate="DLATerminationDateTextBox" Display="Dynamic" Enabled="False" ErrorMessage="DLA Termination Date Required" font-bold="true" ForeColor="Red" SetFocusOnError="True" ValidationGroup="PIP">*</asp:RequiredFieldValidator>
</div>
<br />
<div class="row text-center">
<asp:LinkButton ID="InsertButton" runat="server" CausesValidation="True" cssclass="btn btn-success" OnClick="InsertButton_Click" OnClientClick="changeTextPIP()" Text="Insert" ValidationGroup="PIP" Width="125px" />
<asp:Button ID="InsertCancelButton" runat="server" CausesValidation="False" CommandName="Cancel" cssclass="btn" onclick="InsertCancelButton_Click" Text="Cancel" ValidationGroup="PIP" Width="125px" />
</div>
<br />
</div>
</div>
</InsertItemTemplate>