Modifying Web Interface Builder – Part 2 – Adjusting Column Widths

One or more BPS layouts may be viewed within a frame of a web application. When multiple layouts are thus presented, it is sometimes desirable to vertically line up the columns of each layout to enhance overall readability. An easy way to force alignment is to specific similar column widths. The follow Javascript code will allow adjustment of specified column widths:
Example code:
<script language=JavaScript type=text/javascript>
document.getElementById(“LAYOUT_LAY001-1-1-cell”).width = “300”;
document.getElementById(“LAYOUT_LAY001-1-2-cell”).width = “80”;
document.getElementById(“LAYOUT_LAY001-1-3-cell”).width = “80”;
document.getElementById(“LAYOUT_LAY002-2-1-cell”).width = “300”;
document.getElementById(“LAYOUT_LAY002-2-2-cell”).width = “80”;
document.getElementById(“LAYOUT_LAY002-2-3-cell”).width = “80”;
document.getElementById(“LAYOUT_LAY003-2-1-cell”).width = “300”;
document.getElementById(“LAYOUT_LAY003-2-2-cell”).width = “80”;
document.getElementById(“LAYOUT_LAY003-2-3-cell”).width = “80”;
</script>
The above script sets column 1 of layouts LAY001, LAY002, and LAY003 to 300. Columns 2 and 3 are also set to 80 for each layout.
The result is vertical unification of the three layouts.