I have a strange problem regarding sashes automatically created by DwtListViews. I have attached the full code of my example and a screenshot to illustrate the problem and for anybody who wants to try it out.
The situation is the following:
I have a DwtTree and a DwtListView (4 columns) separated by a DwtSash (HORIZONTAL_STYLE). In addition, I have some existing raw HTML in which I put the Dwt widgets. The raw HTML is the following (generated by the jsp).
Code:
<body>
<table>
<tr>
<td>LALALALALALALALALALALALALALALALALA</td>
<td>
<p>A nice little paragraph before the wflow</p>
<div id="WorkflowDiv"></div>
<p>The footer information</p>
</td>
</tr>
</table>
</body> The widgets are "put" in the div element with id "WorkflowDiv" as follows:
Code:
document.getElementById("WorkflowDiv").appendChild(this._app.getHtmlElement());
where this._app is the DwtShell of the example. The whole thing displays correctly in the browser. However, when I click on one of the columns to resize it, the black line representing the sash between the 2 columns is shifted to the right. Actually, it is shifted to the right, the size of the first cell in the raw HTML. That is, if the first cell of the raw html table of my example has a width of 100px, when you click on the sash of the listview to resize your column, you'll have the black line display 100px to the right of the place you clicked.
How can I solve this ? Is this a bug ?
If you check out my screenshot, I clicked where I put the "red 1" and the black line appears "x" number of pixels to the right. The value of x, is the value of the first cell containing the "LALALA" text.