ok, so Im using a login control in ASP with a cssclass of loginControl.
I setup the cssclass to look like so:
.loginControl
{
font-size: 10px;
font-family: Verdana, Times New Roman, Arial;
vertical-align: middle;
margin-top: 4px;
}
I have the login in a div setup like this:
<div id="status-strip">
<asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName" CssClass="loginControl">User Name:</asp:Label>
<asp:TextBox ID="UserName" runat="server" CssClass="loginControl"></asp:TextBox>
<asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password" CssClass="loginControl">Password:</asp:Label>
<asp:TextBox ID="Password" runat="server" TextMode="Password" CssClass="loginControl"></asp:TextBox>
<asp:Button ID="LoginButton" runat="server" CommandName="Login" Text="Log In" ValidationGroup="ctl00$Login1" CssClass="loginControl" /></div>
In IE7 it acts as if it doesn't apply any format to the textboxes, labels, or buttons, but in Firefox it displays fine, is it different for IE7?Have you tried just using class="loginControl"?
PegWell I tried, but it says that class isn't a valid attribute of the asp:label element.Okay, then the problem is somewhere in the ASP. That's what I figured. I'll just pop this over to the ASP forum for you. Someone there will know how to get it to work.
PegHere is the code on my master page
<%@ Master Language="VB" CodeFile="kaizenMaster.master.vb" Inherits="Home_kaizenMaster" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<link href=http://www.htmlforums.com/archive/index.php/"../Home/kaizen.css" rel="stylesheet" type="text/css" />
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div id="container-all">
<div id="header1">
</div>
<div id="header2">
</div>
<div id="status-strip">
</div>
<div id="content-container">
<div id="left-nav">
<asp:LoginView ID="LoginArea" runat="server">
<AnonymousTemplate>
<asp:Login ID="Login1" runat="server" Width="185px">
<LayoutTemplate>
<div class="login">
<h4>Log In</h4>
<asp:Label ID="UserNameLabel" CssClass="label" runat="server" AssociatedControlID="UserName">User Name:</asp:Label>
<asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName"
ErrorMessage="User Name is required." ToolTip="User Name is required." ValidationGroup="ctl00$ctl00$Login1">*</asp:RequiredFieldValidator>
<asp:TextBox ID="UserName" CssClass="textbox" runat="server"></asp:TextBox> <br />
<asp:Label ID="PasswordLabel" CssClass="label" runat="server" AssociatedControlID="Password">Password:</asp:Label>
<asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password"
ErrorMessage="Password is required." ToolTip="Password is required." ValidationGroup="ctl00$ctl00$Login1">*</asp:RequiredFieldValidator>
<asp:TextBox ID="Password" CssClass="textbox" runat="server" TextMode="Password"></asp:TextBox> <br />
<asp:CheckBox ID="RememberMe" runat="server" Text="Remember me next time." />
<asp:Literal ID="FailureText" runat="server" EnableViewState="False"></asp:Literal>
<asp:Button ID="LoginButton" CssClass="button" runat="server" CommandName="Login" Text="Log In" ValidationGroup="ctl00$ctl00$Login1" />
</div>
</LayoutTemplate>
</asp:Login>
</AnonymousTemplate>
</asp:LoginView>
</div>
<div id="main-content">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
</div>
</form>
</body>
</html>
And here is my css code:
body
{
font-family: verdana, arial, helvetica, sans-serif;
font-size: 0.7em;
color: #666666;
background: #1d1d1d url(images/body_bg.gif) repeat-y top center;
}
#container-all
{
margin-left: auto;
margin-right: auto;
width: auto;
height: auto;
}
#header1
{
margin-left: auto;
margin-right: auto;
background-image: url(images/header1.gif);
width: 780px;
height: 89px;
}
#header2
{
background-image: url(images/header2.jpg);
margin-left: auto;
margin-right: auto;
width: 780px;
height: 151px;
}
#status-strip
{
background-image: url(images/status.gif);
margin-left: auto;
margin-right: auto;
width: 780px;
height: 45px;
padding-left: 3px;
padding-top: 5px;
font-size: 10px;
font-family: Verdana, Times New Roman, Arial;
vertical-align: middle;
}
#content-container
{
margin-left: auto;
margin-right: auto;
width: 780px;
height: 300px;
border: solid 1px #c6c6c6
}
#left-nav
{
background: #FFF url(images/left-nav-bg.jpg) repeat-y top left;
float: left;
width: 200px;
height: 100%;
}
#main-content
{
float: left;
width: 578px;
height: 100%;
}
.label {
display:block;
}
.textbox {
border: 1px solid #929292;
width: 140px;
vertical-align: middle;
margin: 2px 0 5px 0;
}
.button {
display:block;
margin-top:8px;
margin-bottom:8px;
}
.login
{
display:block;
width: 140px;
vertical-align: middle;
}
IE7 isn't rendering any css that I have set for my login stuff. As well as the font color set in the body element.
Thanks for any help.
P.S. I am using visual studio 2005 if that helps anyone.CssClass="login"
I setup the cssclass to look like so:
.loginControl
{
font-size: 10px;
font-family: Verdana, Times New Roman, Arial;
vertical-align: middle;
margin-top: 4px;
}
I have the login in a div setup like this:
<div id="status-strip">
<asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName" CssClass="loginControl">User Name:</asp:Label>
<asp:TextBox ID="UserName" runat="server" CssClass="loginControl"></asp:TextBox>
<asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password" CssClass="loginControl">Password:</asp:Label>
<asp:TextBox ID="Password" runat="server" TextMode="Password" CssClass="loginControl"></asp:TextBox>
<asp:Button ID="LoginButton" runat="server" CommandName="Login" Text="Log In" ValidationGroup="ctl00$Login1" CssClass="loginControl" /></div>
In IE7 it acts as if it doesn't apply any format to the textboxes, labels, or buttons, but in Firefox it displays fine, is it different for IE7?Have you tried just using class="loginControl"?
PegWell I tried, but it says that class isn't a valid attribute of the asp:label element.Okay, then the problem is somewhere in the ASP. That's what I figured. I'll just pop this over to the ASP forum for you. Someone there will know how to get it to work.
PegHere is the code on my master page
<%@ Master Language="VB" CodeFile="kaizenMaster.master.vb" Inherits="Home_kaizenMaster" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<link href=http://www.htmlforums.com/archive/index.php/"../Home/kaizen.css" rel="stylesheet" type="text/css" />
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div id="container-all">
<div id="header1">
</div>
<div id="header2">
</div>
<div id="status-strip">
</div>
<div id="content-container">
<div id="left-nav">
<asp:LoginView ID="LoginArea" runat="server">
<AnonymousTemplate>
<asp:Login ID="Login1" runat="server" Width="185px">
<LayoutTemplate>
<div class="login">
<h4>Log In</h4>
<asp:Label ID="UserNameLabel" CssClass="label" runat="server" AssociatedControlID="UserName">User Name:</asp:Label>
<asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName"
ErrorMessage="User Name is required." ToolTip="User Name is required." ValidationGroup="ctl00$ctl00$Login1">*</asp:RequiredFieldValidator>
<asp:TextBox ID="UserName" CssClass="textbox" runat="server"></asp:TextBox> <br />
<asp:Label ID="PasswordLabel" CssClass="label" runat="server" AssociatedControlID="Password">Password:</asp:Label>
<asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password"
ErrorMessage="Password is required." ToolTip="Password is required." ValidationGroup="ctl00$ctl00$Login1">*</asp:RequiredFieldValidator>
<asp:TextBox ID="Password" CssClass="textbox" runat="server" TextMode="Password"></asp:TextBox> <br />
<asp:CheckBox ID="RememberMe" runat="server" Text="Remember me next time." />
<asp:Literal ID="FailureText" runat="server" EnableViewState="False"></asp:Literal>
<asp:Button ID="LoginButton" CssClass="button" runat="server" CommandName="Login" Text="Log In" ValidationGroup="ctl00$ctl00$Login1" />
</div>
</LayoutTemplate>
</asp:Login>
</AnonymousTemplate>
</asp:LoginView>
</div>
<div id="main-content">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
</div>
</form>
</body>
</html>
And here is my css code:
body
{
font-family: verdana, arial, helvetica, sans-serif;
font-size: 0.7em;
color: #666666;
background: #1d1d1d url(images/body_bg.gif) repeat-y top center;
}
#container-all
{
margin-left: auto;
margin-right: auto;
width: auto;
height: auto;
}
#header1
{
margin-left: auto;
margin-right: auto;
background-image: url(images/header1.gif);
width: 780px;
height: 89px;
}
#header2
{
background-image: url(images/header2.jpg);
margin-left: auto;
margin-right: auto;
width: 780px;
height: 151px;
}
#status-strip
{
background-image: url(images/status.gif);
margin-left: auto;
margin-right: auto;
width: 780px;
height: 45px;
padding-left: 3px;
padding-top: 5px;
font-size: 10px;
font-family: Verdana, Times New Roman, Arial;
vertical-align: middle;
}
#content-container
{
margin-left: auto;
margin-right: auto;
width: 780px;
height: 300px;
border: solid 1px #c6c6c6
}
#left-nav
{
background: #FFF url(images/left-nav-bg.jpg) repeat-y top left;
float: left;
width: 200px;
height: 100%;
}
#main-content
{
float: left;
width: 578px;
height: 100%;
}
.label {
display:block;
}
.textbox {
border: 1px solid #929292;
width: 140px;
vertical-align: middle;
margin: 2px 0 5px 0;
}
.button {
display:block;
margin-top:8px;
margin-bottom:8px;
}
.login
{
display:block;
width: 140px;
vertical-align: middle;
}
IE7 isn't rendering any css that I have set for my login stuff. As well as the font color set in the body element.
Thanks for any help.
P.S. I am using visual studio 2005 if that helps anyone.CssClass="login"