我有一個Asp.Net創建用戶嚮導,並試圖修改和安排其標籤在每個瀏覽器中看起來都一樣。與不同瀏覽器的CSS兼容
現在問題是它看起來不錯,但在IE9和Firefox中看起來相同。
這是它的外觀鍍鉻:
當我進入檢查此處顯示.style屬性的元素有兩個要素,即position:absolute
和Z-指數權:2,使一切都廢棄。
這裏來與IE和Firefox的問題:
當涉及到Firefox和IE它忽視了一切:
我給下面的性質在我的CSS文件如下所示,但這隻適用於鉻,所以我想知道我將如何改變它的IE瀏覽器以及火狐
.signtbl
{
z-index:2;
position:relative !important;
}
這是我對我的控制整個代碼:
<asp:CreateUserWizard ID="CreateUserWizard1" runat="server"
DisableCreatedUser="True" MailDefinition-BodyFileName="~/EmailTemplates/NewAccountTemplate.htm" MailDefinition-From="[email protected]" LoginCreatedUser="False" MailDefinition-IsBodyHtml="True" MailDefinition-Priority="High" MailDefinition-Subject="Pending Activation">
<ContinueButtonStyle BorderStyle="None" CssClass="btn big" Font-Size="12px"/>
<CreateUserButtonStyle CssClass="btn big" Height="30px"
Width="125px" BorderStyle="None" Font-Size="12px" />
<MailDefinition BodyFileName="~/EmailTemplates/NewAccountTemplate.htm"
From="[email protected]" IsBodyHtml="True" Priority="High"
Subject="Pending Activation">
</MailDefinition>
<WizardSteps>
<asp:CreateUserWizardStep ID="CreateUserWizardStep1" runat="server">
<ContentTemplate>
<table>
<tr>
<td align="right">
<asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName" CssClass="signtbl">User Name:</asp:Label>
</td>
<td>
<asp:TextBox ID="UserName" runat="server" BorderStyle="Solid" BorderWidth="1px" BorderColor="#0099CC" BackColor="#FAFFBD" AutoCompleteType="Disabled"></asp:TextBox>
<asp:RequiredFieldValidator ID="UserNameRequired" runat="server"
ControlToValidate="UserName" ErrorMessage="User Name is required."
ToolTip="User Name is required." ValidationGroup="CreateUserWizard1"
CssClass="signupvalidators" ForeColor="Red">*</asp:RequiredFieldValidator>
<div id="divUsernameAvailability" runat="server"></div>
</td>
</tr>
<tr>
<td align="right">
<asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password" CssClass="signtbl">Password:</asp:Label>
</td>
<td>
<asp:TextBox ID="Password" runat="server" TextMode="Password" BorderStyle="Solid" BorderWidth="1px" BorderColor="#0099CC" BackColor="#FAFFBD"></asp:TextBox>
<asp:RequiredFieldValidator ID="PasswordRequired" runat="server"
ControlToValidate="Password" ErrorMessage="Password is required."
ToolTip="Password is required." ValidationGroup="CreateUserWizard1"
CssClass="signupvalidators" ForeColor="Red">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td align="right">
<asp:Label ID="ConfirmPasswordLabel" runat="server"
AssociatedControlID="ConfirmPassword" CssClass="signtbl">Confirm Password:</asp:Label>
</td>
<td>
<asp:TextBox ID="ConfirmPassword" runat="server" TextMode="Password" BorderStyle="Solid" BorderWidth="1px" BorderColor="#0099CC" BackColor="#FAFFBD"></asp:TextBox>
<asp:RequiredFieldValidator ID="ConfirmPasswordRequired" runat="server"
ControlToValidate="ConfirmPassword"
ErrorMessage="Confirm Password is required."
ToolTip="Confirm Password is required."
ValidationGroup="CreateUserWizard1" CssClass="signupvalidators" ForeColor="Red">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td align="right">
<asp:Label ID="EmailLabel" runat="server" AssociatedControlID="Email" CssClass="signtbl">E-mail:</asp:Label>
</td>
<td>
<asp:TextBox ID="Email" runat="server" BorderStyle="Solid" BorderWidth="1px" BorderColor="#0099CC" BackColor="#FAFFBD"></asp:TextBox>
<asp:RequiredFieldValidator ID="EmailRequired" runat="server"
ControlToValidate="Email" ErrorMessage="E-mail is required."
ToolTip="E-mail is required." ValidationGroup="CreateUserWizard1"
CssClass="signupvalidators" ForeColor="Red">*</asp:RequiredFieldValidator>
<div id="divEmailAvailability" runat="server"></div>
</td>
</tr>
<%--<tr>
<td align="right">
<asp:Label ID="QuestionLabel" runat="server" AssociatedControlID="Question" CssClass="signtbl">Security Question:</asp:Label>
</td>
<td>
<asp:TextBox ID="Question" runat="server" BorderStyle="Solid" BorderWidth="1px" BorderColor="#0099CC" BackColor="#FAFFBD"></asp:TextBox>
<asp:RequiredFieldValidator ID="QuestionRequired" runat="server"
ControlToValidate="Question" ErrorMessage="Security question is required."
ToolTip="Security question is required."
ValidationGroup="CreateUserWizard1" CssClass="signupvalidators" ForeColor="Red">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td align="right">
<asp:Label ID="AnswerLabel" runat="server" AssociatedControlID="Answer" CssClass="signtbl">Security Answer:</asp:Label>
</td>
<td>
<asp:TextBox ID="Answer" runat="server" BorderStyle="Solid" BorderWidth="1px" BorderColor="#0099CC" BackColor="#FAFFBD"></asp:TextBox>
<asp:RequiredFieldValidator ID="AnswerRequired" runat="server"
ControlToValidate="Answer" ErrorMessage="Security answer is required."
ToolTip="Security answer is required." ValidationGroup="CreateUserWizard1"
CssClass="signupvalidators" ForeColor="Red">*</asp:RequiredFieldValidator>
</td>
</tr>--%>
<tr>
<td align="center" colspan="2">
<asp:RegularExpressionValidator ID="UsernameLength" runat="server"
ErrorMessage="Username should be minimum 5-10 characters."
ControlToValidate="UserName" Display="Dynamic" ForeColor="Red"
ValidationExpression="^[\s\S]{5,10}$" ValidationGroup="CreateUserWizard1"></asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td align="center" colspan="2">
<asp:CompareValidator ID="PasswordCompare" runat="server"
ControlToCompare="Password" ControlToValidate="ConfirmPassword"
Display="Dynamic"
ErrorMessage="The Password and Confirmation Password must match."
ValidationGroup="CreateUserWizard1" ForeColor="Red"></asp:CompareValidator>
</td>
</tr>
<tr>
<td align="center" colspan="2" style="color:Red;">
<asp:Literal ID="ErrorMessage" runat="server" EnableViewState="False"></asp:Literal>
</td>
</tr>
<tr>
<td align="center" colspan="2">
<asp:RegularExpressionValidator ID="PasswordLength" runat="server" Display="Dynamic"
ErrorMessage="Password length minimum: 7. Non-alphanumeric characters required: 1"
ControlToValidate="Password" ValidationExpression="(?=^.{7,51}$)([A-Za-z]{1})([[email protected]#$%_\^\&\*\-\.\?]{5,49})$"
ForeColor="Red" ValidationGroup="CreateUserWizard1"></asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td align="center" colspan="2">
<asp:RegularExpressionValidator ID="EmailValidator" runat="server" Display="Dynamic"
ControlToValidate="Email" ErrorMessage="Please enter a valid e-mail address." ValidationExpression="^[\w-]+(\.[\w-]+)*@([a-z0-9-]+(\.[a-z0-9-]+)*?\.[a-z]{2,6}|(\d{1,3}\.){3}\d{1,3})(:\d{4})?$" ForeColor="Red" ValidationGroup="CreateUserWizard1"></asp:RegularExpressionValidator>
</td>
</tr>
</table>
<%-- <asp:UpdateProgress ID="UpdateProgressUserDetails" runat="server" DisplayAfter="0">
<ProgressTemplate>
<div style="position: absolute; top: 215px; left:140px;">
<img src="img/Loader.gif" alt="loading" /><br />
</div>
</ProgressTemplate>
</asp:UpdateProgress>--%>
</ContentTemplate>
</asp:CreateUserWizardStep>
<asp:CompleteWizardStep ID="CompleteWizardStep1" runat="server">
<ContentTemplate>
<table>
<tr>
<td align="center" colspan="2">
Complete</td>
</tr>
<tr>
<td>
Your account has been successfully created.</td>
</tr>
<%--<tr>
<td align="right" colspan="2">
<asp:Button ID="ContinueButton" runat="server" BorderStyle="None"
CausesValidation="False" CommandName="Continue" CssClass="btn big"
Font-Size="12px" Text="Continue" ValidationGroup="CreateUserWizard1" />
</td>
</tr>--%>
</table>
</ContentTemplate>
</asp:CompleteWizardStep>
</WizardSteps>
</asp:CreateUserWizard>
什麼是你之所以用'位置的div:絕對'?應該沒有必要。如果你把它輸出,輸入應該與所有瀏覽器中的標籤對齊。 – Deadlykipper 2012-01-18 11:21:08
絕對位置確實造成了這兩個元素的崩潰(的確,爲什麼?)。 DOM不會考慮這兩個項目的寬度,因爲它們絕對是位置。因此,您使用的表格結構會崩潰。 – Rickjaah 2012-01-18 11:28:10
@ Deadlykipper-我沒有使用任何位置:絕對的element.style屬性本身顯示爲絕對和是我在我的樣式表中提到它的位置:relative!important.But這是忽略與Firefox和IE – coder 2012-01-18 11:48:44