Code:
<script type='text/javascript'>

function ubbc(open, end){ 
    var tArea = document.myform.box2; 
    var isIE = (document.all)? true : false; 
    var open = (open)? open : ""; 
    var end = (end)? end : ""; 

    if(isIE){ 
        tArea.focus(); 
        var curSelect = document.selection.createRange(); 
        if(arguments[2]){ 
            curSelect.text = open + arguments[2] + "]" + curSelect.text + end; 
        } else { 
            curSelect.text = open + curSelect.text + end; 
        } 
    } else if(!isIE && typeof tArea.selectionStart != "undefined"){ 
        var selStart = tArea.value.substr(0, tArea.selectionStart); 
        var selEnd = tArea.value.substr(tArea.selectionEnd, tArea.value.length); 
        var curSelection = tArea.value.replace(selStart, '').replace(selEnd, ''); 
        if(arguments[2]){ 
            tArea.value = selStart + open + arguments[2] + "]" + curSelection + end + selEnd; 
        } else { 
            tArea.value = selStart + open + curSelection + end + selEnd; 
        } 
    } else { 
        tArea.value += (arguments[2])? open + arguments[2] + "]" + end : open + end; 
    } 
} 

</script>


<br><br><br><br>
<br><br><br><br>
<br><br><br><br>
<br><br><br><br>
<br><br><br><br>
<br><br><br><br>

<form name='myform' >

<input type='button' value='bold'  style='width:40;height:20' onclick="ubbc('','')">


<select onchange="ubbc('['+this.options[selectedIndex].value+']', '[/'+this.options[selectedIndex].value+']');this.selectedIndex=0;">
<option value=noSize style=color:gray>size</option>
<option value=size1>1</option>
<option value=size2>2</option>
<option value=size3>3</option>
</select>


<textarea name='box2' id='t1' style='width:908px;height:250px'>1111</textarea> 

</form>
When a user clicks bold button or selects one of size option with the code above, the textArea moves up.

How can I make not to move the texArea upward although a user clicks bold button or selects one of size option?