...

View Full Version : CSS and Button Problem



srumphrey
11-14-2002, 08:33 PM
The following code works for everthing else but does nothing to my buttons, they don't change at all. Can someone please tell me what I am doing wrong?


<style type="text/css">

body {font-family: Arial, helvetica, sans-serif }

A:link { color: rgb(0, 0, 0) } /* for unvisited links */
A:visited { color: rgb(0, 0, 0); text-decoration: none }
A:hover { color: white; background: #990000 }

button {font-weight: bold;
font-size: larger;
background: #990000;
color: white;
}
p.Note {font-weight: bold;
font-style: italic;
font-size: smaller;
}

</style>

Tonz
11-14-2002, 08:40 PM
If your button is an image, it wont be affected by a CSS unless yopu set the border (to the image ) to 1px or more.

CSS is for TEXT.


Tonz

Zvona
11-14-2002, 08:41 PM
Originally posted by srumphrey
The following code works for everthing else but does nothing to my buttons, they don't change at all. Can someone please tell me what I am doing wrong?

...
button {font-weight: bold;
font-size: larger;
background: #990000;
color: white;
}
...
</style>

Hmm..I suggest making buttons with INPUT element, instead of BUTTON element. And for CSS1 support, apply class attribute to them.

For instance :
<input type="button" class="btn" value="Push" />

and in style definitions :
.btn {font:bold 1.2em verdana,serif;background-color:#990000;color:#FFFFFF;}

redhead
11-14-2002, 08:41 PM
i'd make sure your using the <button> tag not <input type="button">...

there's nothing wrong with the CSS coding... :confused:

srumphrey
11-14-2002, 08:51 PM
You were right, I am using <INPUT type="BUTTON" and not a button. But, I copied your code straight into it, and still no change. Is input.btn correct? I can find tons of stuff on CSS on how to set your values, but I can't find any list anywhere of how to say WHAT you are making changes to. (I would never be able to guess to use btn instead of button). Does anyone know where that might be?

<style type="text/css">

body {font-family: Arial, helvetica, sans-serif }

A:link { color: rgb(0, 0, 0) } /* for unvisited links */
A:visited { color: rgb(0, 0, 0); text-decoration: none }
A:hover { color: white; background: #990000 }

input.btn {font:bold 1.2em verdana,serif;background-color:#990000;color:#FFFFFF;}

p.Note {font-weight: bold;
font-style: italic;
font-size: smaller;
}

</style>
:confused:

srumphrey
11-14-2002, 09:05 PM
Sorry, I missed your statement about setting the class! I got it working, thanks! I was just completely confused.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum