2 つのテーブル行を隣り合わせに配置する際に問題があります。margin-top を特定の値に設定することで目的を達成できますが、4 つの主要なブラウザーすべてでレイアウトが異なります。これは私がFFで例えば持っているものです:
同じスタイリングを使用して、これは私がIEに持っているものです:
これは、2行目のCSSルールについて私が持っているものです:
.UserProfile {
float:right;
margin-top:-375px;
margin-left:400px;
}
margin-top の値を別の値に変更すると、レイアウトが変更されます。現状では、FF でのみ適切に表示されます。
マークアップと CSS を jsfiddle に配置しました。このリンクはhttp://jsfiddle.net/laziale/2Q7AN/2/にあります。
クイック リファレンスとして、マークアップが配置されている表は次の場所にあります。
<table>
<tr>
<td colspan="2">
<table id="CompanyProfileTable" >
<tr id="Tr1" runat="server">
<td align="left" colspan="2">
<span class="formtitle23">Company Profile</span>
<br />
<br />
</td>
</tr>
<tr>
<td class="leftPR rightPR">
<asp:Label ID="Label4" runat="server" AssociatedControlID="UserName">Company Name:</asp:Label>
</td>
<td class="rightPR">
<asp:TextBox ID="txtCompanyName" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="txtCompanyName"
ErrorMessage="Company Name is required." ToolTip="Company Name is required."
ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR rightPR">
<asp:Label ID="Label7" runat="server" AssociatedControlID="UserName">Website:</asp:Label>
</td>
<td class="rightPR">
<asp:TextBox ID="txtCompanyWebsite" runat="server" CssClass="formfield"></asp:TextBox>
</td>
</tr>
<tr>
<td class="leftPR rightPR">
<asp:Label ID="Label5" runat="server" AssociatedControlID="UserName">Street Address:</asp:Label>
</td>
<td class="rightPR">
<asp:TextBox ID="txtStreetAddress1" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="txtStreetAddress1"
ErrorMessage="Street Address is required." ToolTip="Street Address is required."
ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR rightPR">
<asp:Label ID="Label6" runat="server" AssociatedControlID="UserName">Street Address Line 2:</asp:Label>
</td>
<td class="rightPR">
<asp:TextBox ID="txtStreetAddress2" runat="server" CssClass="formfield"></asp:TextBox>
</td>
</tr>
<tr>
<td class="leftPR rightPR">
Country:
</td>
<td class="rightPR">
<asp:DropDownList ID="ddlCountry" CssClass="formfield FirstName_TD" runat="server" DataSourceID="SqlDataSourceCountry"
DataTextField="Description" DataValueField="CountryID" AutoPostBack="True">
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="leftPR rightPR">
Province:
</td>
<td class="rightPR">
<asp:DropDownList ID="ddlStateProvince" runat="server" OnDataBound="DropDownList2_DataBound"
AutoPostBack="True" DataSourceID="SqlDataSourceStateProvince" DataTextField="Description"
DataValueField="StateProvinceID" CssClass="formfield">
</asp:DropDownList>
<asp:RequiredFieldValidator InitialValue="0" ID="RequiredFieldValidator7" runat="server"
ControlToValidate="ddlStateProvince" ErrorMessage="Province is required." ToolTip="Province is required."
ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR rightPR">
City:
</td>
<td class="rightPR">
<asp:DropDownList ID="ddlCity" runat="server" OnDataBound="DropDownList3_DataBound"
AutoPostBack="True" DataSourceID="SqlDataSourceCity" DataTextField="Description"
DataValueField="CityID" CssClass="formfield" style="overflow:auto;">
</asp:DropDownList>
<asp:RequiredFieldValidator InitialValue="0" ID="RequiredFieldValidator8" runat="server"
ControlToValidate="ddlCity" ErrorMessage="City is required." ToolTip="City is required."
ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR rightPR">
Postal Code:
</td>
<td class="rightPR">
<asp:TextBox ID="txtPostalCode" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="txtPostalCode"
ErrorMessage="Postal Code is required." ToolTip="Postal Code is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR rightPR">
Business Phone:
</td>
<td class="rightPR">
<asp:TextBox ID="txtBusinessPhone1" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="txtBusinessPhone1"
ErrorMessage="Business Phone is required." Display="Dynamic" ToolTip="Business Phone is required."
ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
Ext:<asp:TextBox ID="BusinessPhoneExt1TextBox" runat="server" CssClass="ManageUsers_UserName" Text='<%# Bind("BusinessPhoneExt1") %>'></asp:TextBox>
</td>
</tr>
<tr>
<td class="leftPR rightPR">
<asp:Label ID="Label8" runat="server" AssociatedControlID="UserName">Company Logo:</asp:Label>
</td>
<td class="rightPR">
<asp:FileUpload ID="fuLogo" runat="server" />
</td>
</tr>
<tr>
<td></td>
<td style="color:red;">Company Logo Limit Size: 100kb</td>
</tr>
</table>
</td>
</tr>
<tr class="UserProfile" style="float:right; vertical-align:top;">
<td colspan="2" class="rightPR">
<table id="UserProfileTable">
<tr>
<td colspan="2" class="rightPR">
<br />
<span class="formtitle23">User Profile</span>
<br />
<br />
</td>
</tr>
<tr>
<td class="leftPR FirstName_TD rightPR">
<asp:Label ID="Label2" runat="server" AssociatedControlID="UserName">First Name:</asp:Label>
</td>
<td class="rightPR">
<asp:TextBox ID="txtFirstName" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtFirstName"
ErrorMessage="First Name is required." Display="Dynamic" ToolTip="First Name is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR">
<asp:Label ID="Label3" runat="server" AssociatedControlID="UserName">Last Name:</asp:Label>
</td>
<td>
<asp:TextBox ID="txtLastName" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="txtLastName"
ErrorMessage="Last Name is required." Display="Dynamic" ToolTip="Last Name is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR">
<asp:Label ID="EmailLabel" runat="server" AssociatedControlID="Email">E-mail:</asp:Label>
</td>
<td>
<asp:TextBox ID="Email" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator Display="Dynamic" ID="EmailRequired" runat="server" ControlToValidate="Email"
ErrorMessage="E-mail is required." ToolTip="E-mail is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR">
<asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">User Name:</asp:Label>
</td>
<td>
<asp:TextBox ID="UserName" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="UserNameRequired" Display="Dynamic" runat="server" ControlToValidate="UserName"
ErrorMessage="User Name is required." ToolTip="User Name is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR">
<asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password">Password:</asp:Label>
</td>
<td>
<asp:TextBox ID="Password" runat="server" TextMode="Password" CssClass="formfield"></asp:TextBox><asp:RequiredFieldValidator
ID="PasswordRequired" runat="server" Display="Dynamic" ControlToValidate="Password" ErrorMessage="Password is required."
ToolTip="Password is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR">
<asp:Label ID="ConfirmPasswordLabel" runat="server" AssociatedControlID="ConfirmPassword">Confirm Password:</asp:Label>
</td>
<td>
<asp:TextBox ID="ConfirmPassword" runat="server" TextMode="Password" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="ConfirmPasswordRequired" Display="Dynamic" runat="server" ControlToValidate="ConfirmPassword"
ErrorMessage="Confirm Password is required." ToolTip="Confirm Password is required."
ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR">
<asp:Label ID="QuestionLabel" runat="server" AssociatedControlID="Question">Security Question:</asp:Label>
</td>
<td>
<asp:TextBox ID="Question" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="QuestionRequired" Display="Dynamic" runat="server" ControlToValidate="Question"
ErrorMessage="Security question is required." ToolTip="Security question is required."
ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR">
<asp:Label ID="AnswerLabel" runat="server" AssociatedControlID="Answer">Security Answer:</asp:Label>
</td>
<td>
<asp:TextBox ID="Answer" runat="server" CssClass="formfield"></asp:TextBox>
<asp:RequiredFieldValidator ID="AnswerRequired" Display="Dynamic" runat="server" ControlToValidate="Answer"
ErrorMessage="Security answer is required." ToolTip="Security answer is required."
ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="leftPR">
<asp:Label ID="Label1" runat="server" AssociatedControlID="Answer">User Type:</asp:Label>
</td>
<td>
<asp:DropDownList ID="ddlRoles" runat="server" CssClass="formfield">
</asp:DropDownList>
</td>
</tr>
<tr">
<td class="leftPR">
<asp:Label ID="Label9" runat="server" AssociatedControlID="Answer">Will you be the administrator of the company?</asp:Label>
</td>
<td style="width:50px;">
<asp:DropDownList ID="ddlAdministrator" runat="server" CssClass="formfield">
<asp:ListItem Text="Yes" Value="true" />
<asp:ListItem Text="No" Value="false" />
</asp:DropDownList>
<img alt="ToolTip" src="../Images/ico-question-mark.jpg" onmousemove="move(this,event);" onmouseout="out(this);"/><br /><div id="tip" style="margin-left:60px;margin-top:-168px;">
<img src="../Images/arrowtipright.gif" alt="" class="createResumeTipArrow2" />
One user must be the administrator for the company and will have the ability to add or delete other users on the same company profile.
</div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2" class="ErrorMessage GenericCenter">
<asp:ValidationSummary ID="ValidationSummary1" DisplayMode="BulletList" ValidationGroup="CreateUserWizard1"
runat="server" HeaderText="There are the following error(s) on the page:" />
</td>
</tr>
<tr>
<td colspan="2" class="ErrorMessage GenericCenter">
<asp:Literal ID="ErrorMessage" runat="server" EnableViewState="False"></asp:Literal>
</td>
</tr>
</table>
すべてのアドバイスは大歓迎です。前もって感謝します、 ラツィアーレ