Modifying form elements: How ?

[theplonk]

Hi. I just wanted to know which CSS elements are needed are what they are in order to modify form elements such as the input text box, the scroll bar, or even the srcoll bar of the window!

Specifically, how did http://www.turtleshell.com (the flash guide) changed their scrollbar?

How did http://www.vbulletin.com (purchase section) change the input boxes colors?

How did http://www.flashkit.com change the color of their submit buttons?

Thanks in advance!

[boredboi]

this would be better dealt with in the web design forum
but anyway...

scrollbar colour changing is only available in ie5.5

you could just check their css file to see how they did it...

for changing the background colour of form elements
its background-color: [color]
or background: [url] [repeat] [position] [color]

some browsers, like opera or netscape 4.7, do not support these...

[sylow]

<STYLE type=text/css>
INPUT 		{BACKGROUND-COLOR: #51485f; COLOR: #f5d300; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; FONT-SIZE: 10px}
TEXTAREA	{BACKGROUND-COLOR: #51485f; COLOR: #f5d300; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; FONT-SIZE: 10px}
OPTION 		{BACKGROUND-COLOR: #51485f; COLOR: #f5d300; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; FONT-SIZE: 10px}
FORM 		{FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; FONT-SIZE: 10px}
</STYLE>

I got this from vbulleten to show you how you can look at their source code.
It is at the top of the source of their page. You see how they define INPUT in their CSS? so that is your answer. It is the same method for other websites, just check their source code.

[theplonk]

Thanks! And I'm sorry for taking too much of your time. Next time, I'll try and just look at the source code. Thanks again!

[braveheart]

remember, Netscape 4.x does not allow you to change the form element's using CSS. For IE4.x for example, to hide the scroll bars in a textarea, then

<TEXTAREA ID='myLayer' ROWS... COLS...></TEXTAREA>...</FORM> and then for the script you would use

document.all['myLayer'].style.overflow='hidden';

hope this helps ;-)

[theplonk]

Are there any of these form-related css that will also work with Netscape?