Access Css of Asp:Button

Question

So I want all buttons on my site to look the same and I need to edit a CSS file for them.

I was just wondering how you can access the css style of all controls named -asp:button.

Ie. Button { Font-size: 10px; } or #Button { Font-size: 10px; }

So far this is not working.

"named"? Is this the button's name="" attribute, it's class, it's ID or what? Also, use something like Firebug or Chrome's DOM inspector to see what the generated HTML looks like, and base your selectors from there. You should try a lowercase button selector - see if that works. — Bojangles
– Bojangles, Commented Sep 28, 2011 at 18:33

Doozer Blake · Accepted Answer · 2011-09-28 18:43:16Z

2

Most newer browsers support Attribute Selectors, so you could do something like

input[type="submit"] {
  //styles here
}

You'll get better all around support by applying a class though as others have suggested.

answered Sep 28, 2011 at 18:43

Doozer Blake

7,7984 gold badges31 silver badges41 bronze badges

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

4 Comments

Terry Over a year ago

This will only work with CSS3 compatible browsers which are still a very small portion of the web user base.

Doozer Blake Over a year ago

@TerryR Attribute selectors started in CSS 2.1, and support is pretty broad actually. Ref: quirksmode.org/css/contents.html

Terry Over a year ago

My apologies then, good to know. Just a note: I think IE7 & 8 require a !DOCTYPE to be set for it to work.

Doozer Blake Over a year ago

You are correct about the !DOCTYPE. The support on them isn't perfect by any means, but it's pretty decent these days.

Terry · Accepted Answer · 2011-09-28 18:48:17Z

2

ASP.NET Button controls render as:

<input type="submit">

You will need to give them a css class name that you can control in your css file.

In server side code:

myButton.CssClass = "myClass"

OR in ASPX markup:

<asp:Button CssClass="myClass" runat="server" ... />

CSS:

.myClass { width: 100px }

Edit having seen your comment:

To modify all buttons across the site you need to use Javascript, the jQuery library is extremely effective at this. If you were using jQuery you would just have this script on your Master page:

$(document).ready(function()
{
    // Select all "input" controls with the type of "submit" and add your class to them
    $(input[type="submit"]).addClass('myClass');
});

edited Sep 28, 2011 at 18:48

answered Sep 28, 2011 at 18:36

Terry

14.2k9 gold badges58 silver badges84 bronze badges

6 Comments

joncodo Over a year ago

is there a way to do this without a css class on the button. Similar to setting the css of a table by #table

joncodo Over a year ago

This is possible for sure and I am aware of this solution. I was just trying to use Css

Barry Franklin Over a year ago

input { background-color: #666699; } will give all inputs the background color specified.

Terry Over a year ago

You could use only CSS if your users were all on browsers that support CSS3 as it allows for selectors similar to jQuery. Until then you will have to use some scripting as I have noted in my answer.

Terry Over a year ago

@BarryFranklin that will also affect textboxes, regular buttons and all other input controls which I sincerely doubt he wants.

|

Mohsen · Accepted Answer · 2011-09-28 18:35:49Z

0

You can inclue CSS class in your asp:button code to give them a class and control their style:

<asp:button CssClass="mybuttons" />

Then you can use this class to style those buttons:

.mybuttons{
font-size:10px;
}

If you had more buttons that are not ASP.NET generated then this class only applies to buttons that are ASP.NET generated not others.

answered Sep 28, 2011 at 18:35

Mohsen

66.1k37 gold badges164 silver badges187 bronze badges

4 Comments

joncodo Over a year ago

This is what I know to do for sure. I am wanting to set css for any button anywhere in the site without setting a css class

Mohsen Over a year ago

Simply you can't do that. because ASP renders asp elements to HTML elements. So at at the end there is no difference between and asp button and an solid HTML button.

Mohsen Over a year ago

But if you want to apply a class to any ASP button you can do it in your master page code behind\

Terry Over a year ago

@JonathanO "I am wanting to set css for any button anywhere in the site without setting a css class". The first part of that statement is the whole reason CSS was invented. The second part completely contradicts it and there is no reasonable explanation for not using CSS if you want to achieve that.

Diodeus - James MacFarlane · Accepted Answer · 2011-09-28 18:36:22Z

0

In .NET you need to provide a CSS class for your buttons. If you call it "Button1" for example, your CSS declaration would be:

.Button1 {
   ...
}

answered Sep 28, 2011 at 18:36

Diodeus - James MacFarlane

115k33 gold badges164 silver badges180 bronze badges

Comments

Barry Franklin · Accepted Answer · 2011-09-28 18:44:38Z

0

An ASP button is rendered in HTML as an INPUT of type="submit"... you can access all the buttons by using INPUT, but of course there are other INPUTS as well...

input {
font-weight: bold;
font-size: larger;
background-color: Red;

}

edited Sep 28, 2011 at 18:44

answered Sep 28, 2011 at 18:37

Barry Franklin

1,8401 gold badge28 silver badges50 bronze badges

1 Comment

joncodo Over a year ago

can I do #input submit{css here?}

Collectives™ on Stack Overflow

Access Css of Asp:Button

5 Answers 5

4 Comments

6 Comments

4 Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

4 Comments

6 Comments

4 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related