diff --git a/plugins/woocommerce-admin/docs/components/text-control-with-affixes.md b/plugins/woocommerce-admin/docs/components/text-control-with-affixes.md
index ab12e36087b..8bcb64bc60d 100644
--- a/plugins/woocommerce-admin/docs/components/text-control-with-affixes.md
+++ b/plugins/woocommerce-admin/docs/components/text-control-with-affixes.md
@@ -62,10 +62,3 @@ Markup to be inserted at the beginning of the input.
 Markup to be appended at the end of the input.
 
 - Type: ReactNode
-
-### `noWrap`
-
-A flag that prevents the prefix and suffix from wrapping when the component is displayed on small viewports. This basically disables the corresponding breakpoint.
-
-- Type: Boolean
-- Default: null
\ No newline at end of file
diff --git a/plugins/woocommerce-admin/packages/components/src/text-control-with-affixes/index.js b/plugins/woocommerce-admin/packages/components/src/text-control-with-affixes/index.js
index a74e113dff8..55a5b484954 100644
--- a/plugins/woocommerce-admin/packages/components/src/text-control-with-affixes/index.js
+++ b/plugins/woocommerce-admin/packages/components/src/text-control-with-affixes/index.js
@@ -4,7 +4,6 @@
  */
 import { Component } from '@wordpress/element';
 import PropTypes from 'prop-types';
-import classNames from 'classnames';
 import { BaseControl } from '@wordpress/components';
 import { withInstanceId } from '@wordpress/compose';
 
@@ -17,7 +16,6 @@ class TextControlWithAffixes extends Component {
             className,
             instanceId,
             onChange,
-            noWrap,
             prefix,
             suffix,
             type = 'text',
@@ -29,7 +27,7 @@ class TextControlWithAffixes extends Component {
 
         return (
             <BaseControl label={ label } id={ id } help={ help } className={ className }>
-                <div className={ classNames( 'text-control-with-affixes', { 'no-wrap': noWrap } ) }>
+                <div className="text-control-with-affixes">
                     { prefix && <span className="text-control-with-affixes__prefix">{ prefix }</span> }
 
                     <input className="components-text-control__input"
@@ -49,7 +47,6 @@ class TextControlWithAffixes extends Component {
 }
 
 TextControlWithAffixes.propTypes = {
-    noWrap: PropTypes.bool,
     prefix: PropTypes.node,
     suffix: PropTypes.node,
 };
diff --git a/plugins/woocommerce-admin/packages/components/src/text-control-with-affixes/style.scss b/plugins/woocommerce-admin/packages/components/src/text-control-with-affixes/style.scss
index 097027d1556..fcd587f8052 100644
--- a/plugins/woocommerce-admin/packages/components/src/text-control-with-affixes/style.scss
+++ b/plugins/woocommerce-admin/packages/components/src/text-control-with-affixes/style.scss
@@ -1,49 +1,19 @@
 .text-control-with-affixes {
 	display: inline-flex;
-	flex-direction: column;
+	flex-direction: row;
     width: 100%;
 
-    :nth-child(1) {
-        border-top-left-radius: 4px;
-        border-top-right-radius: 4px;
-    }
+	:nth-child(1) {
+		border-top-right-radius: 0;
+		border-top-left-radius: 4px;
+		border-bottom-left-radius: 4px;
+	}
 
-    :nth-last-child(1) {
-        border-bottom-left-radius: 4px;
-        border-bottom-right-radius: 4px;
-    }
-    
-    &.no-wrap {
-        flex-direction: row;
-        
-        :nth-child(1) {
-            border-top-right-radius: 0;
-            border-top-left-radius: 4px;
-            border-bottom-left-radius: 4px;
-        }
-    
-        :nth-last-child(1) {
-            border-bottom-left-radius: 0;
-            border-top-right-radius: 4px;
-            border-bottom-right-radius: 4px;
-        }
-    }
-
-    @include breakpoint( ">400px" ) {
-        flex-direction: row;
-        
-        :nth-child(1) {
-            border-top-right-radius: 0;
-            border-top-left-radius: 4px;
-            border-bottom-left-radius: 4px;
-        }
-    
-        :nth-last-child(1) {
-            border-bottom-left-radius: 0;
-            border-top-right-radius: 4px;
-            border-bottom-right-radius: 4px;
-        }
-    }
+	:nth-last-child(1) {
+		border-bottom-left-radius: 0;
+		border-top-right-radius: 4px;
+		border-bottom-right-radius: 4px;
+	}
 
     input[type="email"],
     input[type="password"],
@@ -63,18 +33,10 @@
     }
 }
 
-@mixin no-prefix-wrap() {
-	border-right: none;
-}
-
-@mixin no-suffix-wrap() {
-	border-left: none;
-}
-
 .text-control-with-affixes__prefix,
 .text-control-with-affixes__suffix {
 	position: relative;
-	background: $core-grey-light-100;
+	background: $white;
 	border: 1px solid $core-grey-light-500;
 	color: $gray-text;
 	padding: 7px 14px;
@@ -85,19 +47,7 @@
 }
 
 .text-control-with-affixes__prefix {
-	@include breakpoint( "<400px" ) {
-		:not( .no-wrap ) > & {
-			border-bottom: none;
-		}
-	}
-
-	.no-wrap > & {
-		@include no-prefix-wrap();
-	}
-
-	@include breakpoint( ">400px" ) {
-		@include no-prefix-wrap();
-	}
+	border-right: none;
 
 	& + input[type="email"],
 	& + input[type="password"],
@@ -112,17 +62,5 @@
 }
 
 .text-control-with-affixes__suffix {
-	@include breakpoint( "<400px" ) {
-		:not( .no-wrap ) > & {
-			border-top: none;
-		}
-	}
-
-	.no-wrap > & {
-		@include no-suffix-wrap();
-	}
-
-	@include breakpoint( ">400px" ) {
-		@include no-suffix-wrap();
-    }
+	border-left: none;
 }