Forums

This topic is locked

customize file browse button

Posted 04 Dec 2006 13:18:12
1
has voted
04 Dec 2006 13:18:12 turja barua posted:
Hi All,
In my application i want to change the file browse button look and feel. In order to do that i have tried in the following way


input type="file" name="file" class="file" style="width:90px" onchange="addFile(this);">
div class="fakefile">
input type="button" name="Submit22" value='attach' class="inputButton" style="width:100px">
/div>



and in my css file

div class fakefile is as follows

div.fakefile {
position: relative;
top: -20px;
left:5px;
z-index: 0;
}

and file class is as follows:
input.file {
position: relative;
text-align: right;
-moz-opacity:0 ;
filter:alpha(opacity: 0);
opacity: 0;
z-index: 2;
}

so the basic idea is to place button and file object at the same place and one over another ....... so when i click on the button, it interns clicks on the file object..... it works fine in IE but in mozilla two objects are taking different places on the page .......
can anybody help me out!!!
regards
Turja

Reply to this topic