Fixed input width in RadzenFormFields (#1715)

radzenhq · Sep 30, 2024 · bf848d5 · bf848d5
1 parent 285057a
commit bf848d5
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 4 deletions.
diff --git a/Radzen.Blazor/themes/components/blazor/_form-field.scss b/Radzen.Blazor/themes/components/blazor/_form-field.scss
@@ -57,6 +57,10 @@ $form-field-helper-padding: 0 0.5rem !default;
 
         flex: 1;
     }
+
+    & > input {
+        width: 100%;
+    }
 
     .rz-form-field-start,
     .rz-form-field-end {

diff --git a/RadzenBlazorDemos/Pages/FormFieldTextBox.razor b/RadzenBlazorDemos/Pages/FormFieldTextBox.razor
@@ -1,22 +1,22 @@
 <RadzenRow AlignItems="AlignItems.End" Wrap="FlexWrap.Wrap" Gap="1rem" class="rz-p-sm-12">
     <RadzenColumn Size="12" SizeMD="6" SizeLG="3">
         <RadzenFormField Text="Outlined/Default" Style="width: 100%;">
-            <RadzenTextBox @bind-Value="@value" Style="width: 100%;" />
+            <RadzenTextBox @bind-Value="@value" />
         </RadzenFormField>
     </RadzenColumn>
     <RadzenColumn Size="12" SizeMD="6" SizeLG="3">
         <RadzenFormField Text="Text" Variant="Variant.Text" Style="width: 100%;">
-            <RadzenTextBox @bind-Value="@value" Style="width: 100%;" />
+            <RadzenTextBox @bind-Value="@value" />
         </RadzenFormField>
     </RadzenColumn>
     <RadzenColumn Size="12" SizeMD="6" SizeLG="3">
         <RadzenFormField Text="Flat" Variant="Variant.Flat" Style="width: 100%;">
-            <RadzenTextBox @bind-Value="@value" Style="width: 100%;" />
+            <RadzenTextBox @bind-Value="@value" />
         </RadzenFormField>
     </RadzenColumn>
     <RadzenColumn Size="12" SizeMD="6" SizeLG="3">
         <RadzenFormField Text="Filled" Variant="Variant.Filled" Style="width: 100%;">
-            <RadzenTextBox @bind-Value="@value" Style="width: 100%;" />
+            <RadzenTextBox @bind-Value="@value" />
         </RadzenFormField>
     </RadzenColumn>
 </RadzenRow>