File Upload controls and CSS

Hi!

HTML takes "Button" control and "File Upload Control" as two diffrent controls. But those are included in a web page, a normal visitors consider Browse btton of File Upload Contol as another a generic button. You know, actually its visible so.

Now suppose we add button with following styles.

<input type="submit" value="Send " name="B1" style="border:1px solid #CC3300; font-family: Verdana; font-size: 11px; color:#CC3300; font-weight:bold; background-color:#FFCC00">

As said earlier, if button and "browse" buttons looks similar,I think their custom styles(I mean't appearence, not the CSS code), should match together.

I used following style for file upload control.

<input type="file" name="file1" size="20" style="border:1px solid #CC3300; font-size: 10px; font-family: Verdana; padding-left: 4; padding-right: 4; padding-top: 1; padding-bottom: 1">

Then I wanted to change the background color of "browse button of file upload control, without the text control part of the same.

<input type="file" name="file1" size="20" style="border:1px solid #CC3300; font-size: 10px; font-family: Verdana; padding-left: 4; padding-right: 4; padding-top: 1; padding-bottom: 1; background-color:#FFCC00">

Ooops! It's only the text part. I want to keep the text part in document bgcolor, but button part with custom styles.

I'm new to CSS, If you guess above codes are wysiwyg generated, it's true. FrontPage.. :-)

I dont't know whether it's possible to add two styles for two portions of same form control. But if somebody knows it's possible please let me know.

Actually, I have the same problem with the following also.

1. background colors of scroll bars of textareas.
2. Drop Down part [v] of List boxes.
3. Scroll bars of body.. (I know this is possible, but have no code with me).

Thanks and Best Regardsnot sure if I really follow you.. but here is a sample you can style those 2 buttons at least

Css code

<style type="text/css">
.ButtonSend {
border:1px solid #CC3300;
font: Verdana 11px bold;
color:#CC3300;
background-color:#FFCC00;}

.Button1 {
border:1px solid #CC3300;
font: Verdana 10px;
padding:1px 4px;
background-color:#FFCC00}
</style>


html code

<input class="ButtonSend" type="submit" value="Send " name="B1">
<input class="Button1" type="file" name="file1" size="20" >


I dunno why the Browse button isn纾
 
Back
Top