Modifying styles of ASP.NET Textbox and Label tags without setting the style for each one using CssClass.

Hi,

I would like a code example of how to modify ASP.NET Textbox and Label tag styles en mass without having to use the CssClass attribute on every textbox or label.

Many thanks.

hermes_consultingAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

hkhaskellCommented:
Can you please show me the source code of the type of page where you're trying to define the styles?  I'm not too familiar with ASP.NET but I don't need to be in order to show you how to get page elements to behave the way you want with CSS.
0
hkhaskellCommented:
On re-reading your question, it looks like you are assigning styles to each element on the page separately.  If this is the case, an external style sheet will do what you want.  I can easily show you how to do that but want to verify that this what you need.
0
intlaqaCommented:
Hi you can use the Skins and Themes stuff to assign a CssClass once for ALL your Label and TextBox controls.

To do this:

1) Right click your Website in Solution Explorer, then click Add ASP.NET Folder, then choose Theme.
2) Give a name for the them, for example Theme1.
3) Right click your Theme1 in Solution Explorer, then click Add New Item. Then choose Skin File, give it a name, for example: SkinFile.skin
4) Open your SkinFile.skin and then add any attributes you want to be give to ALL your controls, for example:

<asp:TextBox runat="server" CssClass='MyTextBoxes' />
<asp:Label runat="server" CssClass='MyLabels' />

5) On every page, add Theme="Theme1", for example:

<%@ Page Language="C#" Theme="Theme1" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

6) Add some lables and textboxes to the page, you do not have to set their CssClass properties because they are already in the Skin File, for example:

<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

7) Write CSS code for the CssClasses you made in the SkinFile in external CSS file or within the <head> of your page, for example:

<head runat="server">
<style type="text/css">
.MyTextBoxes {background-color:Red;}
.MyLabels {background-color:Yellow;}
</style>
</head>

8) You're done, ALL your TextBoxes on the page are red, and ALL your Labels on that page are Yellow.

If you want to apply this style to ALL your website pages, do not add Theme="Theme1" to every page, just add it in the web.config, for example:

<pages theme="Theme1">
        .....
        .....
</pages>


Alternative method:  ASP.NET labels are rendered as HTML <span> , and all textboxes are rendered as <input type='text' /> or <textarea> if it's TextMode='MultiLine'  so you can just write the following CSS in your CSS file or in the head of the page to apply the style for ALL labels, spans and textboxes without making themes or skins, for example:

<head runat="server">
<style type="text/css">
span {background-color:Red;} /* For Lables */
input[type=text] {background-color:Yellow;} /* For Normal TextBoxes */
textarea {background-color:Yellow;} /* For TextBoxes which TextMode='MultiLine' */
</style>
</head>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Development

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.