Здравствуйте. У есть вот такая таблица
<html>
<head>
<style>
.tableview{
border-collapse: collapse;
}
.cellview{
border: 1px solid rgb(0,0,0);
}
.cellview-inner{
height: 34px;
}
.kix-boxview{
left: px;
top: 9px;
}
.boxview-content{
width: 141px;
padding: 7px;
}
.lineview{
height: 20px;
direction: ltr;
text-align: left;
}
.lineview-content{
margin-left: 0px;
padding-top: 0px;
}
.lineview-content SPAN{
font-size: 11pt;
font-family: Arial;
color: rgb(0,0,0);
background-color: transparent;
font-weight: normal;
font-style: normal;
text-decoration: none;
vertical-align: baseline;
}
div.cDrag div {
background: repeat scroll 0 0 transparent;
cursor:col-resize;
display:block;
float:left;
height:24px;
position:absolute;
width:5px;
border: 1px solid rgb(0,0,0);
}
</style>
</head>
<body>
<div class="cDrag" style="top: 27px;">
<div style="height: 110px; left: 163px;"></div>
<div style="height: 110px; left: 321px;"></div>
<div style="height: 110px; left: 479px;"></div>
</div>
<table class="tableview">
<tbody>
<tr>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
<span>текст</span>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
<span>текст</span>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
<span>текст</span>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
<span>текст</span>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
<span>текст</span>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
<span>текст</span>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
<span>текст</span>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
</div>
</div>
</div>
</div>
</div>
</td>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
<span>текст</span>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content">
<span>текст</span>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="cellview">
<div class="cellview-inner">
<div class="kix-boxview">
<div class="boxview-content">
<div class="lineview">
<div class="lineview-content"></div>
</div>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>
моя задача сделать столбцы этой таблицы перемещаемыми. Я вставил 3 вертикальных DIV-a, мне нужно написать код на JS, с помощью которого я мог бы мышкой схватить за этот DIV и таким образом изменить ширину столбца таблицы.
Помогите мне пожалуйста написать такой обработчик.
P.S: кстати почему-то в IE эти DIV-ы съезжают вправо, в остальных браузерах все ровно.