Topic: Input Box Pages that link to <a href="https://ozoneasylum.com/backlink?for=21609" title="Pages that link to Topic: Input Box" rel="nofollow" >Topic: Input Box\

 
Author Thread
Gilbert Nolander
Maniac (V) Inmate

From: Washington DC
Insane since: May 2002

IP logged posted posted 04-30-2004 22:43 Edit Quote

I have this simple input box on this
site I work on, and I can't figure out how
to change the background color, etc. of the button.
Any help would be cool...

code:
<form action="http://www.google.com/search" method="get">
<input type="text" name="as_q">
<input type="submit" value="GoOgLe!">
</form>



[edit]By the way, I will be away until Monday.[/edit]


< Ozone Quotes >

(Edited by Gilbert Nolander on 04-30-2004 13:44)

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

IP logged posted posted 05-01-2004 00:09 Edit Quote

There are ways to directly set a style based on the type of input, but they are not reliably supported at this point.

The best, for now, is to add a class to the button and set the styles for that class how you want them.

I always have a ".button" class, and use it to apply to both form buttons, and any other link I may want to resemble a button of some sort.

Gilbert Nolander
Maniac (V) Inmate

From: Washington DC
Insane since: May 2002

IP logged posted posted 05-03-2004 13:36 Edit Quote

I actually looked at your links page DL and saw the way you did it,
but couldn't duplicate the results.

I guess I would put

code:
<input type="submit" class="button" value="GoOgLe!">



And then in the style sheet.

code:
input:button {blah blah blah}



I'm not sure if this is right. And what would the 'blah blah blah' be to set background color and text color?


< Ozone Quotes >

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

IP logged posted posted 05-03-2004 14:03 Edit Quote

actually it would need to be "input.button", or more simply, ".button"

The 'blah blah blah' will depend on exactly what you want to do. Mine is currently set as follows:

code:
.button
{
background-color:#c03113;
color:#eee4c0;
font-family:verdana, helvetica, sans-serif;
font-size:10px;
line-height:10px;
font-weight:bold;
border:#577168 1px solid;
margin:5px 0;
padding:1px;
}



The W3C Colors and Backgrounds Spec should be helpful.

Gilbert Nolander
Maniac (V) Inmate

From: Washington DC
Insane since: May 2002

IP logged posted posted 05-03-2004 15:56 Edit Quote

Thanks...
That Did it...



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu