Issue Summary

Content fails to reflow when viewed at 320 * 256-pixel resolution on the "Create Directory Connector" page. 

Steps to Reproduce

1. Open the "Create Directory Connector" page.
2. Press the Command + Control + R key in Safari that will set the screen size to 320 X 256px and observe that reflow causes loss of content and functionality.

Screenshot

Actual Result

When the page is reflowed, the content gets cut off for low-vision users.

Following issues found on Mac when the page is viewed in 320 X 256px 

The content "ldap://ec2-54-91-154-73.compute-1.amazonaws.com:389/", "For newly added users only" and "cn=Administrator,cn=Users,dc=tpm,dc=atlassian,dc=com" present in the  "URL", "User name" and "Synchornise memberships when logging in" form fields are getting cut off

This will result in low-vision users finding it difficult to access the content when zoomed in.

Expected Results

Use relative units to define font and container sizes in CSS to ensure that the page's content reflows correctly when zoomed in. In addition, use CSS media queries to display web page content correctly when zoomed in or viewed using different devices. Content at high zoom levels should be reflowed and should be displayed in a single column.

Workaround

Currently there is no known workaround for this behavior. A workaround will be added here when available

Environment

MacBook Pro (16 inch, 2021)
macOs Ventura  13.5
Chrome - Version 115.0.5790.170 (Official Build) (arm64)
Firefox- Version 112.0. 1
Safari- Version 16.5 (18615.2.9.11.4)
JAWS- Version 2023
NVDA- Version 2023
Voiceover - Version Latest