Form element CSS

S

Simon Wigzell

I can't find a CSS news group that has any traffic so I'm hoping some of the
gurus here can help.

How can I just set all my form buttons to have a particular property?

I know that if I do:

input {cursor: hand;)

Then every single form element will have the cursor change to a hand over
it. How do I do this if I only want the Pushbuttons to have the hand cursor?
Something like:

button {cursor: hand;)

or

input.button {cursor: hand;)

would make logical sense but neither of these is legit. Is it not possible
to set the style for a particular form element? Thanks!
 
S

Stefan B Rusynko

You could create a class
..curhand { cursor: hand; } /* Change Cursor to Hand */
and apply the class to your buttons

<input class="curhand" type="submit" value="Submit Form">

_____________________________________________
SBR @ ENJOY (-: [ Microsoft MVP - FrontPage ]
"Warning - Using the F1 Key will not break anything!" (-;
To find the best Newsgroup for FrontPage support see:
http://www.net-sites.com/sitebuilder/newsgroups.asp
_____________________________________________


| I can't find a CSS news group that has any traffic so I'm hoping some of the
| gurus here can help.
|
| How can I just set all my form buttons to have a particular property?
|
| I know that if I do:
|
| input {cursor: hand;)
|
| Then every single form element will have the cursor change to a hand over
| it. How do I do this if I only want the Pushbuttons to have the hand cursor?
| Something like:
|
| button {cursor: hand;)
|
| or
|
| input.button {cursor: hand;)
|
| would make logical sense but neither of these is legit. Is it not possible
| to set the style for a particular form element? Thanks!
|
|
 
S

Simon Wigzell

snip

Yes, but that is hardly very efficient is it? To have to go into every
webpage and add the class name to every button, - we have hundreds on our
site in dozens of pages.

But is there no way to just say in the CSS file - "all form buttons will
have this particular property"?
 
S

Stefan B Rusynko

Use S&R (all pages in html)
Search for
type="submit"
Replace with
class="curhand" type="submit"




| snip
|
| Yes, but that is hardly very efficient is it? To have to go into every
| webpage and add the class name to every button, - we have hundreds on our
| site in dozens of pages.
|
| But is there no way to just say in the CSS file - "all form buttons will
| have this particular property"?
|
|
 
J

Jack Brewster

The problem is with HTML. Using CSS you can address any HTML entity. The
powers that be back in the dark ages decided to have an element of "input"
that has several different "types." As far as I know, the type value is not
readable by CSS. The only pure CSS way to do this is, as Stefan suggested,
to assign a more specific class to your button elements.

An alternative would be to use Document Object Model (DOM) scripting to
modify only the buttons since "type" is a retrievable value in the DOM.
http://www.w3schools.com/dhtml/dhtml_dom_input.asp

More general info on the DOM:
http://www.w3schools.com/dhtml

In order to script the DOM, JavaScript (JS) must be enabled in the visitor's
browser. Many users disable JavaScript, but I think that number is dropping
due the prevalence of pop-up stoppers. But if you use this method and JS is
disabled, what do you lose? Not much. Just styling on a button.

You should be able to Google for tutorials on modifying CSS using DOM
scripting.
 
S

Simon Wigzell

snip

Okay, so it can't be done the way that seems most logical e.g.

input.button {...}

Damn! Why don't they get together and decide to do it...

Thanks.
 
T

Thomas A. Rowe

Many of us to do not keep read messages, so please don't snip any prior content from your reply, as
others have no idea what you are replying to or about, etc.

--
==============================================
Thomas A. Rowe (Microsoft MVP - FrontPage)
WEBMASTER Resources(tm)

FrontPage Resources, WebCircle, MS KB Quick Links, etc.
==============================================
 
Top