diff --git a/src/composables/useInput.js b/src/composables/useInput.js
index c0d9bb6..0f3b812 100644
--- a/src/composables/useInput.js
+++ b/src/composables/useInput.js
@@ -94,16 +94,6 @@ export function useInput(props, emit) {
             : props.wwElementState.props.readonly;
     });
 
-    const style = computed(() => {
-        const computedStyle = {
-            ...wwLib.wwUtils.getTextStyleFromContent(props.content),
-            '--placeholder-color': props.content.placeholderColor,
-        };
-        delete computedStyle['whiteSpaceCollapse'];
-        delete computedStyle['whiteSpace'];
-        return computedStyle;
-    });
-
     const min = computed(() => {
         if (type.value === 'date') {
             return props.content.minDate;
@@ -281,7 +271,6 @@ export function useInput(props, emit) {
         step,
         inputType,
         isReadonly,
-        style,
         min,
         max,
         stepAttribute,
diff --git a/src/wwElement.vue b/src/wwElement.vue
index 35cb083..2e16fb4 100644
--- a/src/wwElement.vue
+++ b/src/wwElement.vue
@@ -9,7 +9,7 @@
                 v-if="showCurrencySymbol"
                 ref="currencySymbolRef"
                 class="currency-symbol"
-                :style="[currencySymbolStyle, { padding: style.padding }]"
+                :style="currencySymbolStyle"
             >
                 {{ currencySymbol }}
             </span>
@@ -113,7 +113,6 @@ export default {
             step,
             inputType,
             isReadonly,
-            style,
             min,
             max,
             stepAttribute,
@@ -504,7 +503,6 @@ export default {
             required: props.content.required,
             autocomplete: props.content.autocomplete ? 'on' : 'off',
             placeholder: wwLib.wwLang.getText(props.content.placeholder),
-            style: style.value,
             min: min.value,
             max: max.value,
             step: stepAttribute.value,
@@ -519,7 +517,7 @@ export default {
             required: props.content.required,
             placeholder: wwLib.wwLang.getText(props.content.placeholder),
             rows: props.content.rows,
-            style: [style.value, { resize: props.content.resize ? '' : 'none' }],
+            style: { resize: props.content.resize ? '' : 'none' },
         }));
 
         const inputClasses = computed(() => ({
@@ -626,7 +624,6 @@ export default {
             step,
             inputType,
             isReadonly,
-            style,
             isEditing,
             min,
             max,
@@ -678,6 +675,17 @@ export default {
             color: var(--placeholder-color, #000000ad);
             white-space: nowrap; /* Ensure symbol doesn't wrap */
         }
+
+        .ww-input-basic {
+            font: inherit;
+            color: inherit;
+            text-align: inherit;
+            text-transform: inherit;
+            text-shadow: inherit;
+            letter-spacing: inherit;
+            word-spacing: inherit;
+            text-decoration: inherit;
+        }
     }
 }
 
@@ -686,6 +694,9 @@ export default {
     border: none;
     position: relative;
     isolation: isolate;
+    white-space: var(--ww-text-white-space, initial);
+    overflow: var(--ww-text-overflow, initial);
+    text-overflow: var(--ww-text-text-overflow, initial);
 
     &::placeholder {
         color: var(--placeholder-color, #000000ad);
diff --git a/ww-config.js b/ww-config.js
index 5cc1819..e372329 100644
--- a/ww-config.js
+++ b/ww-config.js
@@ -3,6 +3,12 @@ export default {
         type: 'ww-text',
         exclude: ['text'],
     },
+    css({ content }) {
+        const placeholderColor = content.placeholderColor;
+        if (placeholderColor === undefined || placeholderColor === null || placeholderColor === '') return [];
+
+        return [{ property: '--placeholder-color', value: placeholderColor }];
+    },
     editor: {
         label: { en: 'Form Input', fr: 'Entrée de Formulaire' },
         icon: 'text-input',