Put all buttons in a group and use flex to position message and groups.

Instead of setting 100% width on the message, causing inappropriate wrapping of the button text. Removed the nbsp in the Try Again text

src/components/alerts/alert.css

@@ -7,7 +7,7 @@
     display: flex;
     flex-direction: row;
     overflow: hidden;
-    align-items: left;
+    justify-content: space-between;
     border-radius: $space;
     padding: $space;
     margin-bottom: 7px;
@@ -37,13 +37,17 @@
     font-weight: bold;
     font-size: .75rem;
     line-height: 14px;
-    width: 100%;
     display: flex;
     align-items: center;
     padding-left: .5rem;
     padding-right: .5rem;
 }
 
+.alert-buttons {
+    display: flex;
+    flex-direction: row;
+}
+
 .alert-close-button {
     outline-style:none;
 }

src/components/alerts/alert.jsx

@@ -57,54 +57,56 @@ const AlertComponent = ({
                 />
             ) : content}
         </div>
-        {showSaveNow && (
-            <button
-                className={styles.alertConnectionButton}
-                onClick={onSaveNow}
-            >
-                <FormattedMessage
-                    defaultMessage="Try&nbsp;Again" // TODO control wrapping in css
-                    description="Button to try saving again"
-                    id="gui.alerts.tryAgain"
-                />
-            </button>
-        )}
-        {showDownload && (
-            <button
-                className={styles.alertConnectionButton}
-                onClick={onDownload}
-            >
-                <FormattedMessage
-                    defaultMessage="Download"
-                    description="Button to download project locally"
-                    id="gui.alerts.download"
-                />
-            </button>
-        )}
-        {showReconnect && (
-            <button
-                className={styles.alertConnectionButton}
-                onClick={onReconnect}
-            >
-                <FormattedMessage
-                    defaultMessage="Reconnect"
-                    description="Button to reconnect the device"
-                    id="gui.connection.reconnect"
-                />
-            </button>
-        )}
-        {closeButton && (
-            <Box
-                className={styles.alertCloseButtonContainer}
-            >
-                <CloseButton
-                    className={classNames(styles.alertCloseButton)}
-                    color={closeButtonColors[level]}
-                    size={CloseButton.SIZE_LARGE}
-                    onClick={onCloseAlert}
-                />
-            </Box>
-        )}
+        <div className={styles.alertButtons}>
+            {showSaveNow && (
+                <button
+                    className={styles.alertConnectionButton}
+                    onClick={onSaveNow}
+                >
+                    <FormattedMessage
+                        defaultMessage="Try Again"
+                        description="Button to try saving again"
+                        id="gui.alerts.tryAgain"
+                    />
+                </button>
+            )}
+            {showDownload && (
+                <button
+                    className={styles.alertConnectionButton}
+                    onClick={onDownload}
+                >
+                    <FormattedMessage
+                        defaultMessage="Download"
+                        description="Button to download project locally"
+                        id="gui.alerts.download"
+                    />
+                </button>
+            )}
+            {showReconnect && (
+                <button
+                    className={styles.alertConnectionButton}
+                    onClick={onReconnect}
+                >
+                    <FormattedMessage
+                        defaultMessage="Reconnect"
+                        description="Button to reconnect the device"
+                        id="gui.connection.reconnect"
+                    />
+                </button>
+            )}
+            {closeButton && (
+                <Box
+                    className={styles.alertCloseButtonContainer}
+                >
+                    <CloseButton
+                        className={classNames(styles.alertCloseButton)}
+                        color={closeButtonColors[level]}
+                        size={CloseButton.SIZE_LARGE}
+                        onClick={onCloseAlert}
+                    />
+                </Box>
+            )}
+        </div>
     </Box>
 );