How do I implement a CSS class in a control on my web form in ASP .NET?

Question

I have a file in my project called StyleSheet.css.

Here, I have the classes for each element on my web form.

For example:

.selectEnvironment
{
    background-color: #FF0000;
}

Then I go to my control on my web form (a drop down list) and I add the CSS class to it:

   <div>
    <asp:DropDownList ID="ddlEnvironment" runat="server" AutoPostBack="True" 
    OnSelectedIndexChanged="ddlEnvironment_SelectedIndexChanged" CssClass="selectEnvironment">
            <asp:ListItem>Select Environment</asp:ListItem>
            <asp:ListItem>Development</asp:ListItem>
            <asp:ListItem>Staging</asp:ListItem>
            <asp:ListItem>Production</asp:ListItem>
        </asp:DropDownList>
    </div>

This is not working. The background color of this is not changing to red.

What am I doing wrong? I'm completely new to front end web development.

Drag style sheet from Solution Explorer into you page, or master page header, in design view ;-) — IrishChieftain
– IrishChieftain, Commented Sep 24, 2012 at 17:28
Is the class name missing from the element or are the styles themselves missing? Inspect the element in question in your browser or view the source. — cimmanon
– cimmanon, Commented Sep 24, 2012 at 17:32

Aghilas Yakoub · Accepted Answer · 2012-09-24 17:32:10Z

3

You must register your style

    <head runat="server">

      <style type="text/css">
      ...
      </style>
    </head>

You can also use this line

<link href="MyStyles.css" rel="stylesheet" type="text/css" />

You can also register in your code Behind

protected override void OnInit( EventArgs e )
{
    this.Header.InnerHtml += "<link type=\"text/css\" rel=\"Stylesheet\" href=\"styleSheet.css\" />";
    base.OnInit(e);
}

edited Sep 24, 2012 at 17:32

answered Sep 24, 2012 at 17:27

Aghilas Yakoub

29k5 gold badges49 silver badges51 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

JJ. Over a year ago

the code is not on the web page, though. it's on a separate css file in my asp .net project

IrishChieftain Over a year ago

How do you know where his style sheet is located?

Aghilas Yakoub Over a year ago

it's just sample IrishChieftain of registering, because the first problem is missing of regustering

Pradip · Accepted Answer · 2012-09-24 17:37:58Z

2

Add your style to the head portion of the MASTER PAGE. Or link the CSS.
Then add the CSSCLASS to the dropdown menu.
Run and see the magic. It will work.

Check below. enter image description here

LET ME KNOW IF THAT HELPS.

Regards,

Pradie

answered Sep 24, 2012 at 17:37

Pradip

1,53712 silver badges28 bronze badges

1 Comment

IrishChieftain Over a year ago

Don't encourage inline CSS ;-)

IrishChieftain · Accepted Answer · 2012-09-24 17:31:54Z

1

Drag style sheet from Solution Explorer into your page, or master page header, in design view. This is the easiest way to make sure that the style sheet path is correct ;-)

answered Sep 24, 2012 at 17:31

IrishChieftain

15.2k8 gold badges55 silver badges98 bronze badges

1 Comment

JJ. Over a year ago

thanks irish guy! since you were the first to answer with the easiest solution, u get the green!

Collectives™ on Stack Overflow

How do I implement a CSS class in a control on my web form in ASP .NET?

3 Answers 3

3 Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related