Friday, July 07, 2006

ASP.NET and HTML

I have created an ASP.NET 1.1 User control for logging in using forms authentication (fairly standard stuff). I used tables to lay it out and when I did my initial previews in IE 6 it was all fine.

On testing in other browsers later, i.e. Firefox and Opera I get issues.

In Firefox it looks like this -


and in Opera it looks even worse -



The HTML is pretty standard stuff I think -

<table style="WIDTH: 610px" tabIndex="0" borderColor="white" border="0" borderColorDark="#ffffff"
bgColor="#ffffff" borderColorLight="#ffffff">
<tr>
<td style="WIDTH: 151px"><asp:label id="lblUserName" Font-Names="Arial" runat="server">User Name:</asp:label></td>
<td align="right" width="144"><asp:textbox id="txtUser" tabIndex="1" Font-Names="Arial" runat="server" MaxLength="50" Width="160px"></asp:textbox></td>
<td width="200"><ASP:REQUIREDFIELDVALIDATOR id="Requiredfieldvalidator1" Font-Names="Arial" runat="server" ControlToValidate="txtUser"
Display="Static" ErrorMessage="You must enter a user name"></ASP:REQUIREDFIELDVALIDATOR></td>
</tr>
<tr>
<td style="WIDTH: 151px"><asp:label id="lblPassword" Font-Names="Arial" runat="server">Password:</asp:label></td>
<td align="right" width="144"><asp:textbox id="txtPass" tabIndex="2" Font-Names="Arial" runat="server" MaxLength="10" TextMode="Password"
Width="160px"></asp:textbox></td>
<td width="200"><ASP:REQUIREDFIELDVALIDATOR id="Requiredfieldvalidator2" Font-Names="Arial" runat="server" ControlToValidate="txtPass"
Display="Static" ErrorMessage="You must enter a password"></ASP:REQUIREDFIELDVALIDATOR></td>
</tr>
<TR>
<TD style="WIDTH: 151px"><asp:label id="lblConfirm" Font-Names="Arial" runat="server" Visible="False">Confirm Password</asp:label></TD>
<TD align="right" width="144"><asp:textbox id="txtPassConfirm" tabIndex="3" Font-Names="Arial" runat="server" MaxLength="10"
TextMode="Password" Visible="False" Width="160px"></asp:textbox></TD>
<TD width="200"><asp:label id="lblConfirmError" Font-Names="Arial" ForeColor="Red" runat="server" Visible="False">Passwords do not match</asp:label></TD>
</TR>
<TR>
<TD borderColor="#ffffff" borderColorLight="#ffffff" bgColor="#ffffff" borderColorDark="#ffffff"
colSpan="3"><asp:checkbox id="chkRememberMe" Font-Names="Arial" runat="server" Text="Remember me on this computer"></asp:checkbox></TD>
</TR>
<TR>
<TD colSpan="3"><asp:label id="lblMessage" Font-Names="Arial" runat="server"></asp:label></TD>
</TR>
<TR>
<TD align="right" colSpan="2"><asp:button id="butLogin" onclick="butLogin_Click" tabIndex="3" Font-Names="Arial" runat="server"
text="Login" Width="64px"></asp:button></TD>
<td width="200"></td>
</TR>
</table>

When I find the solution to this I will post it here

And in case anyone is wondering how to post HTML on a web page, all I did was to copy the HTML into Notepad, then replace all "<" with "&lt;" and all ">" with "&gt;".

No comments: