Form element CSS

[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!

 

[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">




| 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!
|
|

 

[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"?

 

[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"?
|
|

 

[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.

 

[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.

 

[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.
==============================================