diff --git a/main.js b/main.js
index 38b9852..89a19e8 100644
--- a/main.js
+++ b/main.js
@@ -19,13 +19,15 @@ export function createElement({ innerText, innerHTML, textContent, readOnly, chi
     element.html = (html) => { element.innerHTML = html; return element }
     element.childs = (childs) => { childs.forEach(child => element.appendChild(child)); return element }
     element.bg = (color) => { element.style.backgroundColor = color; return element }
-    //element.p = (padding) => { element.style.padding = padding; return element }
-    //element.m = (margin) => { element.style.margin = margin; return element }
     element.grid = (options) => { element.style.display = 'grid'; Object.assign(element.style, options); return element }
     element.flex = (options) => { element.style.display = 'flex'; Object.assign(element.style, options); return element }
     element.borderRadius = (radius) => { element.style.borderRadius = radius; return element }
     element.p = (padding) => applyStyle(element, 'padding', padding)
     element.m = (margin) => applyStyle(element, 'margin', margin)
+    element.mx = (value) => { element.style.marginLeft = value; element.style.marginRight = value; return element }
+    element.my = (value) => { element.style.marginTop = value; element.style.marginBottom = value; return element }
+    element.px = (value) => { element.style.paddingLeft = value; element.style.paddingRight = value; return element }
+    element.py = (value) => { element.style.paddingTop = value; element.style.paddingBottom = value; return element }
     return element
 }
 
@@ -57,9 +59,11 @@ export class BaseElement {
         return createElement({ children: childs }, this.name)
     }
     static w(width) {
+        if (typeof width === 'number') width = width + 'px'
         return createElement({ style: { width } }, this.name)
     }
     static h(height) {
+        if (typeof height === 'number') height = height + 'px'
         return createElement({ style: { height } }, this.name)
     }
     static bg(color) {
@@ -74,6 +78,11 @@ export class BaseElement {
             const style = { paddingLeft: left, paddingRight: right, paddingTop: top, paddingBottom: bottom }
             return createElement({ style }, this.name)
         }
+        if (args.length === 4) {
+            const [top, right, bottom, left] = args
+            const style = { paddingTop: top, paddingRight: right, paddingBottom: bottom, paddingLeft: left }
+            return createElement({ style }, this.name)
+        }
     }
     static m(...args) {
         if (args.length === 1 && typeof args[0] === 'string') {
@@ -84,6 +93,27 @@ export class BaseElement {
             const style = { marginLeft: left, marginRight: right, marginTop: top, marginBottom: bottom }
             return createElement({ style }, this.name)
         }
+        if (args.length === 4) {
+            const [top, right, bottom, left] = args
+            const style = { marginTop: top, marginRight: right, marginBottom: bottom, marginLeft: left }
+            return createElement({ style }, this.name)
+        }
+    }
+    static mx(value) {
+        if (typeof value === 'number') value = value + 'px'
+        return createElement({ style: { marginLeft: value, marginRight: value } }, this.name)
+    }
+    static my(value) {
+        if (typeof value === 'number') value = value + 'px'
+        return createElement({ style: { marginTop: value, marginBottom: value } }, this.name)
+    }
+    static px(value) {
+        if (typeof value === 'number') value = value + 'px'
+        return createElement({ style: { paddingLeft: value, paddingRight: value } }, this.name)
+    }
+    static py(value) {
+        if (typeof value === 'number') value = value + 'px'
+        return createElement({ style: { paddingTop: value, paddingBottom: value } }, this.name)
     }
     static grid(options) {
         return createElement({ style: { display: 'grid', ...options } }, this.name)
diff --git a/package.json b/package.json
index e6a4a78..7c39a03 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@laniakeasupercluster/widgets",
   "description": "A simple widgets tracker",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "type": "module",
   "main": "main.js",
   "author": "Laniakea Supercluster <huan0016@gmail.com>",