0

I can apply a CSS style to an html link using

<link href="css/style.css" rel="stylesheet" type="text/css" />
<a href="/members/Default.aspx" id="loginCss">Login</a>

Is it possible to apply the same CSS style id loginCSS to the following control?

    <div class="buttonCSS">
        <asp:HyperLink ID="HyperLink1" runat="server" 
        NavigateUrl="~/Admin/Default.aspx" >Login as Admin</asp:HyperLink>
    </div>

I've tried the following

<asp:HyperLink ID="loginCss" runat="server" 
NavigateUrl="~/Members/Default.aspx" >Login as Member</asp:HyperLink>

which gives error 'loginCSS' is not a valid identifier.

5 Answers 5

3

In your css, I'm guessing you have a style based on control names:

#loginCss{

   //Your styles here

}

If you change it to be based on class name:

.NewLoginCss{

   //Your styles here

 }

You can reference it in multiple places using the .NET CssClass and HTML class attributes:

<a href="/members/Default.aspx" id="loginCss" class="NewLoginCss">Login</a>

<asp:HyperLink ID="loginCss" runat="server" 
     NavigateUrl="~/Members/Default.aspx" 
     CssClass="NewLoginCss">Login as Member</asp:HyperLink>
Sign up to request clarification or add additional context in comments.

Comments

3

You probably want to avoid using IDs when dealing with .NET web controls as the IDs end up looking something like: ct100_blahblah_controlName_blahblah

So just use the CssClass attribute in the Hyperlink Control:

<asp:Hyperlink ID="hyp1" CssClass="className" />

And your CSS would be:

.className { color: FFF; }

Comments

1

I believe ID's are pretty reserved in the older versions of .NET which is why many backend devs prefer their front-end buddies to use css classes instead.

You can look up how to apply those on your elements, but I believe its CssClass="classname"

<asp:HyperLink ID="" CssClass="loginCss" runat="server" 
NavigateUrl="~/Members/Default.aspx" >Login as Member</asp:HyperLink>

Comments

1

when you add "runat='server'" all ids will be prepended with ContentPlaceHolder_

so if ur id before server side was "bla" it will be "ContentPlaceHolder_bla" and thats the name u should use for selectors on client side. from server side the elements will still be available by old name.

2 Comments

This is not a good approach specially in case of Css as one could have nested content place holder and id's get quite complex in that case.
agreed. but this is the standard procedure to grab the ID from client side if the control runs on server.
0

You cannot have same ID of two ASP.Net controls. There are other ways to achieve your goal. A better approach is to use CssClass attribute.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.