Problems using the '#' to identify tags in a master/content/css page combination
I want to separate the design and implementation of my web pages into a separate HTML and CSS files (for easier maintenance).
I have the following Page defined in a project.
<%@ Page Title="" Language="C#" MasterPageFile="~/STGGeneral.Master" AutoEventWireup="true" CodeBehind="Register.aspx.cs" Inherits="SystemManager.Register" %>
And this makes a reference to the following CSS file
#UsernameLabel
{
position: absolute;
top: 10px;
left: 10px;
}
The trouble is when ASP.NET generates the code sent to the browser it sends the following
<!-- Login Popup -->
<input type="image" name="ctl00$LoginButton" id="ctl00_LoginButton" class="LoginButton" src="Images/key.png" style="border-width:0px;" />
<div id="ctl00_LoginFormPanel" class="LoginPanel">
<div id="ctl00_UpdatePanel1">
<span id="ctl00_LabelUsername">UserId:</span>
<input name="ctl00$UsernameTextBox" type="text" id="ctl00_UsernameTextBox" /&g开发者_JAVA技巧t;
<span id="ctl00_LabelPassword" class="StandardLabel">Label</span>
<input name="ctl00$PasswordTextBox" type="text" id="ctl00_PasswordTextBox" />
<input type="image" name="ctl00$ConfirmLoginButton" id="ctl00_ConfirmLoginButton" class="ConfirmLoginButton" UseSubmitBehavior="false" src="Images/Security.png" style="border-width:0px;" />
</div>
</div>
Because my 'Username' label is now called ctl00_LabelUsername by ASP.NET the style which positions this code тo longer works.
Is there a way of telling ASP.NET that I do not want it to change the name of my objects, or how do you do a reference using '#' within a page generated by a master/content page combination.
If you are on .NET 4.0, they added ClientIDMode for this purpose
http://weblogs.asp.net/scottgu/archive/2010/03/30/cleaner-html-markup-with-asp-net-4-web-forms-client-ids-vs-2010-and-net-4-0-series.aspx
If you are not using ASP.NET 4.0 you can give a class to the Label, like
LabelUsername.CSSClass = "LabelClass";
else you can try using the CSS selector like-
.LoginPanel span
{
// CSS Propeties for the label.
}
Quite simple. You change your css to reference ctl00_LabelUsername
精彩评论