diff --git a/app/View/Components/Form/Section.php b/app/View/Components/Form/Section.php
index a496f37e3..bcff129fe 100644
--- a/app/View/Components/Form/Section.php
+++ b/app/View/Components/Form/Section.php
@@ -19,11 +19,11 @@ class Section extends Component
      * @return void
      */
     public function __construct(
-        string $spacingVertical = 'gap-x-8', string $spacingHorizontal = 'gap-y-6', string $columnNumber = 'sm:grid-cols-6',
+        string $spacingVertical = 'gap-y-6', string $spacingHorizontal = 'gap-x-8', string $columnNumber = 'sm:grid-cols-6',
     ) {
         $this->spacingVertical = $spacingVertical;
         $this->spacingHorizontal = $spacingHorizontal;
-        $columnNumber = $columnNumber;
+        $this->columnNumber = $columnNumber;
     }
 
     /**
diff --git a/resources/views/banking/reconciliations/create.blade.php b/resources/views/banking/reconciliations/create.blade.php
index ea9f09cc8..2d6f0515b 100644
--- a/resources/views/banking/reconciliations/create.blade.php
+++ b/resources/views/banking/reconciliations/create.blade.php
@@ -12,8 +12,8 @@
     <x-slot name="content">
         <div class="relative mt-4">
             <x-form id="form-create-reconciliation" method="get" route="reconciliations.create">
-                <div class=" mb-14">
-                    <div class="grid sm:grid-cols-10 gap-x-8 gap-y-6 my-3.5 mt-3.5 lg:mt-8">
+                <x-form.section column-number="sm:grid-cols-10">
+                    <x-slot name="body">
                         <x-form.group.date
                             name="started_at"
                             label="{{ trans('reconciliations.start_date') }}"
@@ -66,8 +66,8 @@
                                 {{ trans('reconciliations.transactions') }}
                             </x-button>
                         </div>
-                    </div>
-                </div>
+                    </x-slot>
+                </x-form.section>
             </x-form>
 
             <div id="reconciliations-table">
diff --git a/resources/views/modules/api_key/create.blade.php b/resources/views/modules/api_key/create.blade.php
index f2fa1aea3..61451cab8 100644
--- a/resources/views/modules/api_key/create.blade.php
+++ b/resources/views/modules/api_key/create.blade.php
@@ -5,7 +5,7 @@
 
     <x-slot name="content">
         <x-form id="form-app" route="apps.api-key.store">
-            <x-form.section spacing-horizontal="gap-y-2">
+            <x-form.section spacing-vertical="gap-y-2">
                 <x-slot name="body">
                     <x-form.group.text name="api_key" placeholder="{{ trans('general.form.enter', ['field' => trans('modules.api_key')]) }}" value="{{ setting('apps.api_key', null) }}" />