On applying reflow resolution all content present under the Schema section is not visible it is getting truncated and two scroll bars are appearing for it.

[msftedad]

Q&A (please complete the following information)

• OS: Windows 11 Enterprise - 23H2
• Browser: Chrome- Version 124.0.6367.93 (Official Build) (64-bit)
• Edge - Version 124.0.2478.80 (Official build) (64-bit)
• Method of installation: npm
• Swagger-UI version: 4.6.1
• Swagger/OpenAPI version: [e.g. Swagger 2.0, OpenAPI 3.0]

Content & configuration

Example Swagger/OpenAPI definition:

# your YAML here

Swagger-UI configuration options:

SwaggerUI({
  // your config options here
})

?yourQueryStringConfig

Describe the bug you're encountering

On applying reflow resolution all content present under the Schema section is not visible it is getting truncated and two scroll bars are appearing for it.

To reproduce...

Steps to reproduce the behavior:

1. Launch the URL : https://codesandbox.io/p/sandbox/nervous-fog-d87m3w?file=%2fpackage.json
2. TAB till "Schema " section.
3. Tab till "Pet" and press enter.
4. Observe that On applying reflow resolution all content present under the Schema section is not visible it is getting truncated and two scroll bars are appearing for it or not.

Expected behavior

On applying reflow resolution all content present under the Schema section is should be visible it is should not get truncated and two scroll bars or Horizontal Scroll bar should not be appear for it.

Screenshots

https://github.com/swagger-api/swagger-ui/assets/93735775/3c23f46d-40d4-4abc-8d57-4db24827e397

Additional context or thoughts

[msftedad]

Hi @maggiewachs, Is there any update on this bug, and could you please provide a tentative ETA for fixing it?

[maggiewachs]

See my comment here: https://github.com/swagger-api/swagger-ui/issues/8172#issuecomment-2286601376