diff --git src/bp-core/bp-core-avatars.php src/bp-core/bp-core-avatars.php
index 1553725..aa44bab 100644
--- src/bp-core/bp-core-avatars.php
+++ src/bp-core/bp-core-avatars.php
@@ -820,8 +820,15 @@ function bp_core_avatar_handle_upload( $file, $upload_dir_filter ) {
 		return false;
 	}
 
+	$browser_max_width = 0;
+
+	// If we have the browser_max_width, set it.
+	if ( isset( $bp->avatar_admin->browser_max_width ) ) {
+		$browser_max_width = $bp->avatar_admin->browser_max_width;
+	}
+
 	// Maybe resize.
-	$bp->avatar_admin->resized = $avatar_attachment->shrink( $bp->avatar_admin->original['file'] );
+	$bp->avatar_admin->resized = $avatar_attachment->shrink( $bp->avatar_admin->original['file'], $browser_max_width );
 	$bp->avatar_admin->image   = new stdClass();
 
 	// We only want to handle one image after resize.
@@ -933,6 +940,11 @@ function bp_avatar_ajax_upload() {
 		$bp->avatar_admin = new stdClass();
 	}
 
+	// Get the browser max width if available
+	if ( isset( $bp_params['browser_max_width'] ) ) {
+		$bp->avatar_admin->browser_max_width =  (int) $bp_params['browser_max_width'];
+	}
+
 	// Upload the avatar
 	$avatar = bp_core_avatar_handle_upload( $_FILES, $bp_params['upload_dir_filter'] );
 
diff --git src/bp-core/classes/class-bp-attachment-avatar.php src/bp-core/classes/class-bp-attachment-avatar.php
index 604ee23..8c47ad8 100644
--- src/bp-core/classes/class-bp-attachment-avatar.php
+++ src/bp-core/classes/class-bp-attachment-avatar.php
@@ -117,6 +117,7 @@ class BP_Attachment_Avatar extends BP_Attachment {
 	 * Maybe shrink the attachment to fit maximum allowed width.
 	 *
 	 * @since 2.3.0
+	 * @since 2.4.0 Add the $browser_max_width parameter, to inform about the Avatar UI width.
 	 *
 	 * @uses  bp_core_avatar_original_max_width()
 	 *
@@ -124,18 +125,31 @@ class BP_Attachment_Avatar extends BP_Attachment {
 	 *
 	 * @return mixed
 	 */
-	public static function shrink( $file = '' ) {
+	public static function shrink( $file = '', $browser_max_width = 0 ) {
 		// Get image size
 		$avatar_data = parent::get_image_data( $file );
 
 		// Init the edit args
 		$edit_args = array();
 
+		// Defaults to the Avatar original max width constant.
+		$original_max_width = bp_core_avatar_original_max_width();
+
+		// If we have a browser max width and it's smaller than the Avatar original max width
+		if ( ! empty( $browser_max_width ) && $browser_max_width < $original_max_width ) {
+			$original_max_width = $browser_max_width;
+
+			// $original_max_width has to be larger than the avatar's full width
+			if ( $original_max_width < bp_core_avatar_full_width() ) {
+				$original_max_width = bp_core_avatar_full_width();
+			}
+		}
+
 		// Do we need to resize the image ?
-		if ( isset( $avatar_data['width'] ) && $avatar_data['width'] > bp_core_avatar_original_max_width() ) {
+		if ( isset( $avatar_data['width'] ) && $avatar_data['width'] > $original_max_width ) {
 			$edit_args = array(
-				'max_w' => bp_core_avatar_original_max_width(),
-				'max_h' => bp_core_avatar_original_max_width(),
+				'max_w' => $original_max_width,
+				'max_h' => $original_max_width,
 			);
 		}
 
diff --git src/bp-core/js/bp-plupload.js src/bp-core/js/bp-plupload.js
index d758516..43e77d6 100644
--- src/bp-core/js/bp-plupload.js
+++ src/bp-core/js/bp-plupload.js
@@ -60,13 +60,26 @@ window.bp = window.bp || {};
 		 * @param {plupload.Uploader} uploader Uploader instance.
 		 */
 		this.uploader.bind( 'Init', function( uploader ) {
-			var container = $( '#' + self.params.defaults.container ),
-			    drop_element = $( '#' + self.params.defaults.drop_element );
+			var container    = $( '#' + self.params.defaults.container ),
+			    drop_element = $( '#' + self.params.defaults.drop_element ),
+			    browser_max_width;
 
 			if ( 'html4' === uploader.runtime ) {
 				uploader.settings.multipart_params.html4 = true;
 			}
 
+			/**
+			 * Avatars need to be cropped, by default we are using an original
+			 * max width of 450px, but there can be cases when this max width
+			 * is larger than the one of the Avatar UI (eg: on mobile). To avoid any
+			 * difficulties, we're adding a browser_max_width argument to the bp_params
+			 * object and set it according to the container width. This value will be
+			 * checked during the upload process to eventually adapt the resized avatar.
+			 */
+			if ( 'bp_avatar_upload' ===  uploader.settings.multipart_params.action ) {
+				 uploader.settings.multipart_params.bp_params.browser_max_width = container.width();
+			}
+
 			if ( uploader.features.dragdrop && ! self.params.browser.mobile ) {
 				container.addClass( 'drag-drop' );
 				drop_element.bind( 'dragover.wp-uploader', function() {