diff --git a/src/custom-border/custom-dv-1/custom-dv-1.scss b/src/custom-border/custom-dv-1/custom-dv-1.scss
index 876ca0e7f6e1bb17639d654606e234ced0e31dd1..a7c8dc5e0f2dfd6864d2ff04e0be1cb0bd5e3e4c 100644
--- a/src/custom-border/custom-dv-1/custom-dv-1.scss
+++ b/src/custom-border/custom-dv-1/custom-dv-1.scss
@@ -7,7 +7,12 @@ $style-1: (
   @include when(style-1) {
     position: relative;
     width: 100%;
-    height: calc(100% - getCssVar(style-1,'offsetY'));
+    height: 100%;
+    @include e(wrapper){
+      position: absolute;
+      width: 100%;
+      height: calc(100% - getCssVar(style-1,'offsetY'));
+    }
     @include e(border-box) {
     z-index: 100;
     height: 0;
diff --git a/src/custom-border/custom-dv-1/custom-dv-1.tsx b/src/custom-border/custom-dv-1/custom-dv-1.tsx
index edb238b6d5d31b09d6e6f4e12c210c9d25d4fda0..213e31552f76784e983d3489d80ccf4c5bb32819 100644
--- a/src/custom-border/custom-dv-1/custom-dv-1.tsx
+++ b/src/custom-border/custom-dv-1/custom-dv-1.tsx
@@ -165,7 +165,7 @@ export const CustomDV1 = defineComponent({
         class={[this.ns.b(), this.ns.is('style-1', true)]}
         style={`--ibiz-style-1-offsetY:${this.offsetY}px`}
       >
-        {this.renderBorder()}
+        <div class={this.ns.e('wrapper')}>{this.renderBorder()}</div>
         <div class={this.ns.e('content')}>{this.$slots.default?.()}</div>
       </div>
     );
diff --git a/src/custom-border/custom-dv-10/custom-dv-10.scss b/src/custom-border/custom-dv-10/custom-dv-10.scss
index 1e513d3e6c4f0d0cdc47617d25e38799f1b3850e..23d570792729dc35f381fdeae5c29384c3b25b7d 100644
--- a/src/custom-border/custom-dv-10/custom-dv-10.scss
+++ b/src/custom-border/custom-dv-10/custom-dv-10.scss
@@ -9,7 +9,12 @@ $style-10: (
   @include when(style-10) {
     position: relative;
     width: 100%;
-    height: calc(100% - getCssVar(style-10, 'offsetY'));
+    height: 100%;
+    @include e(wrapper){
+      position: absolute;
+      width: 100%;
+      height: calc(100% - getCssVar(style-10, 'offsetY'));
+    }
     @include e(border-box) {
       z-index: 100;
       height: 0;
@@ -19,7 +24,7 @@ $style-10: (
       top: getCssVar(style-10, 'padding');
       left: getCssVar(style-10, 'padding');
       width:  calc(100% - 2 * getCssVar(style-10, 'padding'));
-      height: calc(100% - 2 * getCssVar(style-10, 'padding'));
+      height: calc(100% - 2 * getCssVar(style-10, 'padding') - getCssVar(style-10, 'offsetY'));
       border-radius: 10px;
     }
     @include e(border-svg) {
diff --git a/src/custom-border/custom-dv-10/custom-dv-10.tsx b/src/custom-border/custom-dv-10/custom-dv-10.tsx
index 13d10f1fec351f8ef625fd840accbb2cbb2751e7..824f04db37989281571d11cb32bd08f1c4656b29 100644
--- a/src/custom-border/custom-dv-10/custom-dv-10.tsx
+++ b/src/custom-border/custom-dv-10/custom-dv-10.tsx
@@ -112,7 +112,7 @@ export const CustomDV10 = defineComponent({
         class={[this.ns.b(), this.ns.is('style-10', true)]}
         style={`--ibiz-style-10-offsetY:${this.offsety}px;--ibiz-style-10-padding:${this.padding}px`}
       >
-        {this.renderBorder()}
+        <div class={this.ns.e('wrapper')}>{this.renderBorder()}</div>
         <div
           class={this.ns.e('mask')}
           style={`box-shadow: inset 0 0 25px 3px ${this.mergedColor[0]};background-color: ${this.backgroundColor};`}
diff --git a/src/screen-portlet/screen-portlet.scss b/src/screen-portlet/screen-portlet.scss
index 84248ac9dc6aa675c8af9d24505b8971464dbc3f..ba8d63c5fc1a9ad4efd158c53e10f99bf84af5a6 100644
--- a/src/screen-portlet/screen-portlet.scss
+++ b/src/screen-portlet/screen-portlet.scss
@@ -57,9 +57,11 @@
     }
 
     &.is-style-10 {
-      transform: translateY(50px);
-      .#{bem(custom-border,content)} {
-        transform: translateY(-50px);
+      .#{bem(custom-border,wrapper)} {
+        transform: translateY(50px);
+      }
+      .#{bem(custom-border,mask)} {
+        transform: translateY(50px);
       }
     }