in my web page i have a table and i want its first column to be resizeable. it works fine in IE8 but on Mozilla it shows resize icon in bottom right corner of the document. this is the code
$(".resizable").resizable({
maxHeight: 25,
maxWidth: 350,
minHeight: 25,
minWidth: 150
});
here is how it shows up in IE8 
here is how it shows up in Firefox 
plz see the resize icon on bottom right corner
<table cellspacing="0">
<thead>
<tr>
<th class="resizable ui-resizable">Task Number<div class="ui-resizable-handle ui-resizable-e" unselectable="on" style="-moz-user-select: none;"></div><div class="ui-resizable-handle ui-resizable-s" unselectable="on" style="-moz-user-select: none;"></div><div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 1001; -moz-user-select: none;" unselectable="on"></div></th>
<th>Start Date</th>
<th>Duration</th>
<th style="width: 100px;">DeadLine</th>
<th>Parent TaskID</th>
</tr>
</thead>
<tbody>
<tr class="1" id="row-0" style="">
<td width="150">
<div style="width: 14px;" class="wrapper">
</div>
TaskN
</td>
<td style="text-align: center;">
<input type="text" value="01/12/2010" style="text-align: center;" name="StartDate[0]" id="StartDate_0_" class="DatePicker 11 hasDatepicker">
</td>
<td>
<input type="text" value="7" name="Duration[0]" id="Duration_0_" class="DurationChange 11">
</td>
<td></td>
<td></td>
</tr>
<tr class="2" id="row-1" style="">
<td width="150">
<div style="width: 14px;" class="wrapper">
</div>
TaskP
</td>
<td style="text-align: center;">
<input type="text" value="01/11/2010" style="text-align: center;" name="StartDate[1]" id="StartDate_1_" class="DatePicker 12 hasDatepicker">
</td>
<td>
<input type="text" value="7" name="Duration[1]" id="Duration_1_" class="DurationChange 12">
</td>
<td></td>
<td></td>
</tr>
<tr class="3" id="row-2" style="color: blue;">
<td width="150">
<div style="width: 14px;" class="wrapper">
<span lang="on" class="navigator"> </span>
</div>
Task12
</td>
<td style="text-align: center;">
16/12/2010
</td>
<td>
5
</td>
<td>18/11/2010</td>
<td></td>
</tr>
<tr class="3.1" id="row-3" style="color: orange;">
<td width="150">
<div style="width: 28px;" class="wrapper">
<span lang="on" class="navigator"> </span>
</div>
Task2
</td>
<td style="text-align: center;">
10/12/2010
</td>
<td>
5
</td>
<td>19/09/2010</td>
<td>1</td>
</tr>
<tr class="3.1.1" id="row-4" style="color: red;">
<td width="150">
<div style="width: 42px;" class="wrapper">
<span lang="on" class="navigator"> </span>
</div>
Task3
</td>
<td style="text-align: center;">
22/12/2010
</td>
<td>
1
</td>
<td></td>
<td>2</td>
</tr>
<tr class="3.1.1.1" id="row-5" style="color: red;">
<td width="150">
<div style="width: 56px;" class="wrapper">
</div>
Task9
</td>
<td style="text-align: center;">
<input type="text" value="30/10/2010" style="text-align: center;" name="StartDate[5]" id="StartDate_5_" class="DatePicker 9 hasDatepicker">
</td>
<td>
<input type="text" value="34" name="Duration[5]" id="Duration_5_" class="DurationChange 9">
</td>
<td></td>
<td>3</td>
</tr>
<tr class="3.1.2" id="row-6" style="color: orange;">
<td width="150">
<div style="width: 42px;" class="wrapper">
</div>
Task10
</td>
<td style="text-align: center;">
<input type="text" value="30/10/2010" style="text-align: center;" name="StartDate[6]" id="StartDate_6_" class="DatePicker 10 hasDatepicker">
</td>
<td>
<input type="text" value="12" name="Duration[6]" id="Duration_6_" class="DurationChange 10">
</td>
<td>04/10/2010</td>
<td>2</td>
</tr>
<tr class="3.2" id="row-7" style="color: red;">
<td width="150">
<div style="width: 28px;" class="wrapper">
</div>
task5
</td>
<td style="text-align: center;">
<input type="text" value="25/10/2010" style="text-align: center;" name="StartDate[7]" id="StartDate_7_" class="DatePicker 5 hasDatepicker">
</td>
<td>
<input type="text" value="3" name="Duration[7]" id="Duration_7_" class="DurationChange 5">
</td>
<td></td>
<td>1</td>
</tr>
<tr class="3.3" id="row-8" style="color: orange;">
<td width="150">
<div style="width: 28px;" class="wrapper">
</div>
001
</td>
<td style="text-align: center;">
<input type="text" value="19/10/2010" style="text-align: center;" name="StartDate[8]" id="StartDate_8_" class="DatePicker 7 hasDatepicker">
</td>
<td>
<input type="text" value="5" name="Duration[8]" id="Duration_8_" class="DurationChange 7">
</td>
<td>23/10/2010</td>
<td>1</td>
</tr>
<tr class="4" id="row-9" style="">
<td width="150">
<div style="width: 14px;" class="wrapper">
</div>
Task4
</td>
<td style="text-align: center;">
15/01/2011
</td>
<td>
5
</td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
i solved this problem by putting the div in td and assigning resizable class to td instead of td itself. its now working fine both in IE and firefox