diff --git a/ganttzk/src/main/java/org/zkoss/ganttz/resourceload/ResourcesLoadPanel.java b/ganttzk/src/main/java/org/zkoss/ganttz/resourceload/ResourcesLoadPanel.java
index 540f84f5c..254a15ff0 100644
--- a/ganttzk/src/main/java/org/zkoss/ganttz/resourceload/ResourcesLoadPanel.java
+++ b/ganttzk/src/main/java/org/zkoss/ganttz/resourceload/ResourcesLoadPanel.java
@@ -9,14 +9,9 @@ import org.zkoss.ganttz.timetracker.TimeTracker;
 import org.zkoss.ganttz.timetracker.TimeTrackerComponent;
 import org.zkoss.ganttz.util.MutableTreeModel;
 import org.zkoss.zk.au.out.AuInvoke;
-import org.zkoss.zk.ui.ext.AfterCompose;
-import org.zkoss.zkex.zul.Borderlayout;
-import org.zkoss.zkex.zul.Center;
-import org.zkoss.zkex.zul.West;
-import org.zkoss.zul.Div;
-import org.zkoss.zul.impl.XulElement;
+import org.zkoss.zk.ui.HtmlMacroComponent;
 
-public class ResourcesLoadPanel extends XulElement implements AfterCompose {
+public class ResourcesLoadPanel extends HtmlMacroComponent {
 
     private TimeTrackerComponent timeTrackerComponent;
 
@@ -36,31 +31,6 @@ public class ResourcesLoadPanel extends XulElement implements AfterCompose {
         resourceLoadList = new ResourceLoadList(timeTracker, treeModel);
         leftPane = new ResourceLoadLeftPane(treeModel, resourceLoadList);
 
-        Borderlayout bl = new Borderlayout();
-        bl.setHeight("300px");
-        bl.setWidth("1600px");
-        bl.setSclass("resourcesload");
-
-        West w = new West();
-        w.setSize("200px");
-        w.setFlex(true);
-        w.setSplittable(true);
-        w.setCollapsible(true);
-        w.setStyle("overflow: scroll");
-        w.appendChild(leftPane);
-
-        Center c = new Center();
-        c.setFlex(true);
-        c.setStyle("overflow: scroll");
-        Div d = new Div();
-        d.appendChild(getTimeTrackerComponent());
-        d.appendChild(getResourceLoadList());
-        c.appendChild(d);
-
-        bl.appendChild(w);
-        bl.appendChild(c);
-        appendChild(bl);
-
     }
 
     private MutableTreeModel<LoadTimeLine> createModelForTree() {
@@ -89,17 +59,12 @@ public class ResourcesLoadPanel extends XulElement implements AfterCompose {
 
     @Override
     public void afterCompose() {
-        timeTrackerComponent.afterCompose();
+        super.afterCompose();
+        getFellow("insertionPointLeftPanel").appendChild(leftPane);
         leftPane.afterCompose();
-    }
-
-    public TimeTrackerComponent getTimeTrackerComponent() {
-        // timeTrackerComponent.setWidth("100%");
-        return timeTrackerComponent;
-    }
-
-    public ResourceLoadList getResourceLoadList() {
-        return resourceLoadList;
+        getFellow("insertionPointRightPanel").appendChild(timeTrackerComponent);
+        getFellow("insertionPointRightPanel").appendChild(resourceLoadList);
+        timeTrackerComponent.afterCompose();
     }
 
     public Planner getPlanner() {
diff --git a/ganttzk/src/main/resources/metainfo/zk/lang-addon.xml b/ganttzk/src/main/resources/metainfo/zk/lang-addon.xml
index ea353b855..bfea60753 100755
--- a/ganttzk/src/main/resources/metainfo/zk/lang-addon.xml
+++ b/ganttzk/src/main/resources/metainfo/zk/lang-addon.xml
@@ -23,10 +23,7 @@
 	<component>
 		<component-name>resourcesLoadPanel</component-name>
 		<component-class>org.zkoss.ganttz.resourceload.ResourcesLoadPanel</component-class>
-		<mold>
-			<mold-name>default</mold-name>
-			<mold-uri>~./ganttz/resourceload/resourcesLoadPanel.dsp</mold-uri>
-		</mold>
+	        <macro-uri>~./ganttz/zul/resourcesLoadLayout.zul</macro-uri>
 	</component>
 
     <component>
@@ -143,4 +140,4 @@
         <macro-uri>~./ganttz/zul/scripts.zul</macro-uri>
     </component>
 
-</language-addon>
\ No newline at end of file
+</language-addon>
diff --git a/ganttzk/src/main/resources/web/ganttz/resourceload/resourcesLoadPanel.dsp b/ganttzk/src/main/resources/web/ganttz/resourceload/resourcesLoadPanel.dsp
deleted file mode 100644
index 64bcc594b..000000000
--- a/ganttzk/src/main/resources/web/ganttz/resourceload/resourcesLoadPanel.dsp
+++ /dev/null
@@ -1,11 +0,0 @@
-<%@ taglib uri="http://www.zkoss.org/dsp/web/core" prefix="c" %>
-<%@ taglib uri="http://www.zkoss.org/dsp/zk/core" prefix="z" %>
-
-<c:set var="self" value="${requestScope.arg.self}"/>
-<div id="${self.uuid}" class="resourcesloadpanel" z.type="ganttz.resourceload.resourcesloadpanel.ResourcesLoadPanel" ${self.outerAttrs}>
-    <c:forEach var="child" items="${self.children}">
-        ${z:redraw(child, null)}
-    </c:forEach>
-</div>
-
-<br/>
\ No newline at end of file
diff --git a/ganttzk/src/main/resources/web/ganttz/zul/resourcesLoadLayout.zul b/ganttzk/src/main/resources/web/ganttz/zul/resourcesLoadLayout.zul
new file mode 100644
index 000000000..1b3b19a87
--- /dev/null
+++ b/ganttzk/src/main/resources/web/ganttz/zul/resourcesLoadLayout.zul
@@ -0,0 +1,14 @@
+<zk xmlns:n="http://www.zkoss.org/2005/zk/native">
+
+    <borderlayout height="300px" width="1600px" sclass="resourcesload">
+        <west size="200px" flex="true" collapsible="true" splittable="true" autoscroll="true">
+            <div id="insertionPointLeftPanel"></div>
+        </west>
+
+        <center autoscroll="true">
+            <div id="insertionPointRightPanel"></div>
+        </center>
+
+    </borderlayout>
+
+</zk>
\ No newline at end of file
diff --git a/navalplanner-webapp/src/main/webapp/planner/css/ganttzk.css b/navalplanner-webapp/src/main/webapp/planner/css/ganttzk.css
index 74eb7446e..2c2bbb253 100644
--- a/navalplanner-webapp/src/main/webapp/planner/css/ganttzk.css
+++ b/navalplanner-webapp/src/main/webapp/planner/css/ganttzk.css
@@ -401,7 +401,7 @@ tr.z-vbox-sep {
 
 .resourceloadleftpane {
 	border: 1px;
-	margin-top: 70px;
+	margin-top: 43px;
 	width: 325px;
 	padding-right: 15px;
 }