diff --git a/d.ts/antos.d.ts b/d.ts/antos.d.ts
index eca74b0..e507db1 100644
--- a/d.ts/antos.d.ts
+++ b/d.ts/antos.d.ts
@@ -4624,9 +4624,9 @@ declare namespace OS {
                  */
                 set buttons(v: GenericObject<any>[]);
                 /**
-                 * Getter: Get list direction: horizontal or vertical (default)
+                 * Getter: Get list direction: row or column (default)
                  *
-                 * Setter: Get list direction: horizontal or vertical
+                 * Setter: Get list direction: row or column
                  *
                  * @type {string}
                  * @memberof ListViewTag
@@ -5155,8 +5155,8 @@ declare namespace OS {
                  * Setter:
                  *
                  * Set the tab bar direction:
-                 * - `horizontal`: horizontal direction
-                 * - `vertical`: vertical direction
+                 * - `row`: horizontal direction
+                 * - `column`: vertical direction
                  *
                  * Getter:
                  *
@@ -5477,8 +5477,8 @@ declare namespace OS {
                  * Setter:
                  *
                  * Set resize direction, two possible values:
-                 * - `hz` - horizontal direction, resize by width
-                 * - `ve` - vertical direction, resize by height
+                 * - `row` - horizontal direction, resize by width
+                 * - `column` - vertical direction, resize by height
                  *
                  * Getter:
                  *
diff --git a/src/core/gui.ts b/src/core/gui.ts
index ae1c59a..af0664b 100644
--- a/src/core/gui.ts
+++ b/src/core/gui.ts
@@ -1267,7 +1267,7 @@ namespace OS {
         schemes.ws = `\
 <afx-sys-panel id = "syspanel"></afx-sys-panel>
 <div id = "workspace">
-    <afx-desktop id = "desktop" dir="vertical" ></afx-desktop>
+    <afx-desktop id = "desktop" dir="column" ></afx-desktop>
     <afx-notification id="sys_notification" ></afx-notification>
 </div>
 <afx-stack-menu id="contextmenu" data-id="contextmenu" context="true" style="display:none;"></afx-stack-menu>
diff --git a/src/core/tags/FloatListTag.ts b/src/core/tags/FloatListTag.ts
index cdb862f..4a19c66 100644
--- a/src/core/tags/FloatListTag.ts
+++ b/src/core/tags/FloatListTag.ts
@@ -169,7 +169,7 @@ namespace OS {
                                 .css("left", `${cleft}px`);
                             const w = $(e).width();
                             const h = $(e).height();
-                            if (this.dir === "vertical") {
+                            if (this.dir === "column") {
                                 ctop += h + 20;
                                 if (ctop + h > gh) {
                                     ctop = 20;
diff --git a/src/core/tags/ListViewTag.ts b/src/core/tags/ListViewTag.ts
index 7b6547f..3cf410c 100644
--- a/src/core/tags/ListViewTag.ts
+++ b/src/core/tags/ListViewTag.ts
@@ -777,9 +777,9 @@ namespace OS {
                     }
                 }
                 /**
-                 * Getter: Get list direction: horizontal or vertical (default)
+                 * Getter: Get list direction: row or column (default)
                  *
-                 * Setter: Get list direction: horizontal or vertical
+                 * Setter: Get list direction: row or column
                  *
                  * @type {string}
                  * @memberof ListViewTag
@@ -787,7 +787,7 @@ namespace OS {
                 set dir(v: string) {
                     if(this.dropdown)
                     {
-                        $(this).attr("dir", "vertical");
+                        $(this).attr("dir", "column");
                     }
                     else
                     {
@@ -1357,7 +1357,7 @@ namespace OS {
                  */
                 scroll_to_end()
                 {
-                    if(this.dir == "vertical")
+                    if(this.dir == "column")
                     {
                         this.refs.mlist.scrollTo({ top: this.refs.mlist.scrollHeight, behavior: 'smooth' });
                     }
@@ -1374,7 +1374,7 @@ namespace OS {
                  */
                 scroll_to_start()
                 {
-                    if(this.dir == "vertical")
+                    if(this.dir == "column")
                     {
                         this.refs.mlist.scrollTo({ top: 0, behavior: 'smooth' });
                     }
diff --git a/src/core/tags/ResizerTag.ts b/src/core/tags/ResizerTag.ts
index 1af3239..5355780 100644
--- a/src/core/tags/ResizerTag.ts
+++ b/src/core/tags/ResizerTag.ts
@@ -92,8 +92,8 @@ namespace OS {
                  * Setter:
                  *
                  * Set resize direction, two possible values:
-                 * - `hz` - horizontal direction, resize by width
-                 * - `ve` - vertical direction, resize by height
+                 * - `row` - horizontal direction, resize by width
+                 * - `column` - vertical direction, resize by height
                  *
                  * Getter:
                  *
@@ -105,18 +105,14 @@ namespace OS {
                     let att: string;
                     $(this).attr("dir", v);
                     $(this).off("pointerdown", null);
-                    if (v === "hz") {
-                        $(this).css("cursor", "col-resize");
-                        $(this).addClass("horizontal");
+                    if (v === "row") {
                         if (this._resizable_el) {
                             att = $(this._resizable_el).attr("min-width");
                             if (att) {
                                 this._minsize = parseInt(att);
                             }
                         }
-                    } else if (v === "ve") {
-                        $(this).css("cursor", "row-resize");
-                        $(this).addClass("vertical");
+                    } else if (v === "column") {
                         if (this._resizable_el) {
                             att = $(this._resizable_el).attr("min-height");
                             if (att) {
@@ -192,11 +188,11 @@ namespace OS {
                         return;
                     }
                     if (tagname === "AFX-HBOX") {
-                        this.dir = "hz";
+                        this.dir = "row";
                     } else if (tagname === "AFX-VBOX") {
-                        this.dir = "ve";
+                        this.dir = "column";
                     } else {
-                        this.dir = "hz";
+                        this.dir = "row";
                     }
                 }
 
@@ -235,9 +231,9 @@ namespace OS {
                             if (!this._resizable_el) {
                                 return;
                             }
-                            if (this.dir === "hz") {
+                            if (this.dir === "row") {
                                 return this.horizontalResize(evt as JQuery.MouseEventBase);
-                            } else if (this.dir === "ve") {
+                            } else if (this.dir === "column") {
                                 return this.verticalResize(evt as JQuery.MouseEventBase);
                             }
                         });
diff --git a/src/core/tags/TabBarTag.ts b/src/core/tags/TabBarTag.ts
index b32e448..06f60c3 100644
--- a/src/core/tags/TabBarTag.ts
+++ b/src/core/tags/TabBarTag.ts
@@ -64,7 +64,7 @@ namespace OS {
                  */
                 protected init(): void {
                     this.selected = -1;
-                    this.dir = "horizontal";
+                    this.dir = "row";
                     this._previous_touch = {x: 0, y:0};
                 }
 
@@ -95,8 +95,8 @@ namespace OS {
                  * Setter:
                  * 
                  * Set the tab bar direction:
-                 * - `horizontal`: horizontal direction
-                 * - `vertical`: vertical direction
+                 * - `row`: horizontal direction
+                 * - `column`: vertical direction
                  * 
                  * Getter:
                  * 
@@ -109,6 +109,7 @@ namespace OS {
                     if (!v) {
                         return;
                     }
+                    console.log("direction is", v);
                     (this.refs.list as ListViewTag).dir = v;
                 }
                 get dir(): string {
@@ -233,7 +234,7 @@ namespace OS {
                             const offset = {x:0, y:0};
                             offset.x = this._previous_touch.x - e.touches[0].pageX ;
                             offset.y = this._previous_touch.y - e.touches[0].pageY; 
-                            if(this.dir == "horizontal")
+                            if(this.dir == "row")
                             {
                                 el.scrollLeft += offset.x;
                             }
@@ -245,7 +246,7 @@ namespace OS {
                             this._previous_touch.y = e.touches[0].pageY;
                         }, {passive: true});
                         el.addEventListener("wheel", (evt)=>{
-                            if(this.dir == "horizontal")
+                            if(this.dir == "row")
                             {
                                 el.scrollLeft += (evt as WheelEvent).deltaY;
                             }
@@ -265,7 +266,7 @@ namespace OS {
                 scroll_to_end()
                 {
                     const list_container = $(".list-container", this.refs.list)[0];
-                    if(this.dir == "vertical")
+                    if(this.dir == "column")
                     {
                         list_container.scrollTo({ top: list_container.scrollHeight, behavior: 'smooth' });
                     }
@@ -283,7 +284,7 @@ namespace OS {
                 scroll_to_start()
                 {
                     const list_container = $(".list-container", this.refs.list)[0];
-                    if(this.dir == "vertical")
+                    if(this.dir == "column")
                     {
                         list_container.scrollTo({ top: 0, behavior: 'smooth' });
                     }
diff --git a/src/core/tags/TabContainerTag.ts b/src/core/tags/TabContainerTag.ts
index 189d7d6..c6efa7d 100644
--- a/src/core/tags/TabContainerTag.ts
+++ b/src/core/tags/TabContainerTag.ts
@@ -133,13 +133,13 @@ namespace OS {
                         return;
                     }
                     (this.refs.wrapper as TileLayoutTag).dir = v;
-                    if(v === "row")
+                    if(v == "row")
                     {
-                        (this.refs.bar as TabBarTag).dir = "vertical";
+                        (this.refs.bar as TabBarTag).dir = "column";
                     }
                     else
                     {
-                        (this.refs.bar as TabBarTag).dir = "horizontal";
+                        (this.refs.bar as TabBarTag).dir = "row";
                     }
                 }
                 get dir(): "row" | "column" {
diff --git a/src/packages/Files/README.md b/src/packages/Files/README.md
index 66a6eb1..a0085d1 100644
--- a/src/packages/Files/README.md
+++ b/src/packages/Files/README.md
@@ -6,5 +6,6 @@ This application is included in the AntOS delivery as system application and
 cannot be removed/uinstalled by regular user
 
 ## Change logs
+- v0.1.9-b: use "column"/"row" for UI direction names
 - v0.1.8-b: use system css variables in theme
 - v0.1.7-b: fix - file grid view double click event hanling on diffent cells of a row
\ No newline at end of file
diff --git a/src/packages/Files/main.ts b/src/packages/Files/main.ts
index 66ee3a8..e26e0f9 100644
--- a/src/packages/Files/main.ts
+++ b/src/packages/Files/main.ts
@@ -374,7 +374,7 @@ namespace OS {
 
                         fav.dropdown = false;
 
-                        resizer.dir = "hz";
+                        resizer.dir = "row";
                         resizer.disable = false;
                     }
                     else
@@ -388,7 +388,7 @@ namespace OS {
 
                         fav.dropdown = true;
 
-                        resizer.dir = "ve";
+                        resizer.dir = "column";
                         resizer.disable = true;
                     }
                 });
diff --git a/src/packages/Files/package.json b/src/packages/Files/package.json
index 2418612..0231124 100644
--- a/src/packages/Files/package.json
+++ b/src/packages/Files/package.json
@@ -6,7 +6,7 @@
         "author": "Xuan Sang LE",
         "email": "xsang.le@gmail.com"
     },
-    "version":"0.1.8-b",
+    "version":"0.1.9-b",
     "category":"System",
     "iconclass":"fa fa-hdd-o",
     "mimes":["dir"],
diff --git a/src/packages/Files/scheme.html b/src/packages/Files/scheme.html
index ae86361..044ea5f 100644
--- a/src/packages/Files/scheme.html
+++ b/src/packages/Files/scheme.html
@@ -3,10 +3,10 @@
             <afx-tile data-height = "35" min-width="120" data-width="180" data-id = "nav-bar" name="hbox" dir="row">
                 <afx-list-view data-id = "favouri" dropdown="true"></afx-list-view>
             </afx-tile>
-            <afx-resizer data-id="resizer" dir="ve" disable="true" data-width="3" data-height="0"></afx-resizer>
+            <afx-resizer data-id="resizer" dir="column" disable="true" data-width="3" data-height="0"></afx-resizer>
             <afx-vbox>
                 <afx-hbox data-width="120" data-height="35" data-id="nav-bar">
-                    <afx-tab-bar data-id = "path-nav" dir="horizontal" ></afx-tab-bar>
+                    <afx-tab-bar data-id = "path-nav" dir="row" ></afx-tab-bar>
                     <afx-button data-width = "40" data-id = "btback" iconclass = "fa fa-arrow-up"></afx-button>
                     <afx-button data-width = "40"  data-id = "btgrid" iconclass = "fa fa-th"></afx-button>
                     <afx-button data-width = "40"  data-id = "btlist" iconclass = "fa fa-th-list"></afx-button>
diff --git a/src/themes/default/afx-resizer.css b/src/themes/default/afx-resizer.css
index 471c6e1..7a226da 100644
--- a/src/themes/default/afx-resizer.css
+++ b/src/themes/default/afx-resizer.css
@@ -1,13 +1,16 @@
-afx-resizer.vertical {
+afx-resizer[dir='column'] {
     background-color: transparent;
     border-top: 1px solid var(--border-primary);
+    cursor: row-resize;
 }
-afx-resizer.horizontal {
+afx-resizer[dir='row']  {
     background-color: transparent;
     border-left: 1px solid var(--border-primary);
+    cursor: col-resize;
 }
 
-afx-resizer.horizontal:hover, afx-resizer.vertical:hover
+afx-resizer[dir='row']:hover,
+afx-resizer[dir='column']:hover
 {
     background-color: var(--item-bg-active);
 }
\ No newline at end of file
diff --git a/src/themes/default/afx-tab-bar.css b/src/themes/default/afx-tab-bar.css
index 73c1989..f7ff8f6 100644
--- a/src/themes/default/afx-tab-bar.css
+++ b/src/themes/default/afx-tab-bar.css
@@ -1,12 +1,12 @@
 
-afx-tab-bar[dir="horizontal"] afx-list-view > div.list-container > ul > afx-list-item > li.selected
+afx-tab-bar[dir="row"] afx-list-view > div.list-container > ul > afx-list-item > li.selected
 {
     background-color: var(--background-tertiary);
     color:var(--text-primary);
     border-bottom:2px solid var(--border-tertiary); /* #262626;*/
 }
 
-afx-tab-bar[dir="vertical"] afx-list-view > div.list-container > ul > afx-list-item > li.selected
+afx-tab-bar[dir="column"] afx-list-view > div.list-container > ul > afx-list-item > li.selected
 {
     background-color: var(--background-tertiary);
     color:var(--text-primary);
diff --git a/src/themes/system/afx-list-view.css b/src/themes/system/afx-list-view.css
index 15a6e2d..cfab3d2 100644
--- a/src/themes/system/afx-list-view.css
+++ b/src/themes/system/afx-list-view.css
@@ -35,7 +35,7 @@ afx-list-view  > div.list-container > ul  li{
 afx-list-view  > div.list-container > ul afx-dbline-list-item li{
     min-height: 40px;
 }
-.afx-list-view[dir='horizontal']  > div.list-container > ul
+.afx-list-view[dir='row']  > div.list-container > ul
 {
     display: flex;
     flex-direction: row;
diff --git a/src/themes/system/afx-tab-bar.css b/src/themes/system/afx-tab-bar.css
index 4915960..ba74592 100644
--- a/src/themes/system/afx-tab-bar.css
+++ b/src/themes/system/afx-tab-bar.css
@@ -16,12 +16,12 @@ afx-tab-bar afx-list-view > div.list-container > ul li
     padding-right: 10px;
 }
 
-afx-tab-bar[dir="vertical"] afx-list-view > div.list-container
+afx-tab-bar[dir="column"] afx-list-view > div.list-container
 {
     overflow: hidden;
 }
 
-afx-tab-bar[dir="horizontal"] afx-list-view > div.list-container
+afx-tab-bar[dir="row"] afx-list-view > div.list-container
 {
     overflow: hidden;
 }