Text length can extend beyond the boundary of its container panel on a model's detail page #9496

Closed
opened 2025-12-29 20:50:40 +01:00 by adam · 3 comments
Owner

Originally created by @atownson on GitHub (Apr 17, 2024).

Originally assigned to: @jeremystretch on GitHub.

Deployment Type

Self-hosted

NetBox Version

v4.0-beta1

Python Version

3.10

Steps to Reproduce

Hey guys, I wanted to revisit #10596 for v4.0-beta1. It seems this behavior is the same when using Tabler. Thanks for your work.

  1. Create a custom field with a Type of Text for any given model.
  2. Add a value to any given instantiated model for the custom field that is rather long, say 100 characters.
  3. View the model's detail page and observe the value extends beyond the panel boundary, given the width of the webpage.

Expected Behavior

The horizontally-long text should either wrap or a scrollbar should be shown.

Observed Behavior

The text extends beyond the panel boundaries.
image

Originally created by @atownson on GitHub (Apr 17, 2024). Originally assigned to: @jeremystretch on GitHub. ### Deployment Type Self-hosted ### NetBox Version v4.0-beta1 ### Python Version 3.10 ### Steps to Reproduce Hey guys, I wanted to revisit #10596 for v4.0-beta1. It seems this behavior is the same when using Tabler. Thanks for your work. 1. Create a custom field with a Type of Text for any given model. 2. Add a value to any given instantiated model for the custom field that is rather long, say 100 characters. 3. View the model's detail page and observe the value extends beyond the panel boundary, given the width of the webpage. ### Expected Behavior The horizontally-long text should either wrap or a scrollbar should be shown. ### Observed Behavior The text extends beyond the panel boundaries. ![image](https://github.com/netbox-community/netbox/assets/52260120/42c0022a-02a0-4e80-a9b3-f827c6763ebf)
adam added the type: bugstatus: acceptedbetatopic: UI/UXseverity: low labels 2025-12-29 20:50:40 +01:00
adam closed this issue 2025-12-29 20:50:41 +01:00
Author
Owner

@jeffgdotorg commented on GitHub (Apr 19, 2024):

Unless I've gone to a different URL (which I can't tell for sure since your screenshot is cropped pretty tightly), I'm unable to reproduce this as reported. The text wraps as expected for me.
image

Are we looking at the same thing?

@jeffgdotorg commented on GitHub (Apr 19, 2024): Unless I've gone to a different URL (which I can't tell for sure since your screenshot is cropped pretty tightly), I'm unable to reproduce this as reported. The text wraps as expected for me. <img width="1512" alt="image" src="https://github.com/netbox-community/netbox/assets/1209268/62e36d28-86c0-4139-93f4-914c195241db"> Are we looking at the same thing?
Author
Owner

@jeremystretch commented on GitHub (Apr 19, 2024):

In @atownson's example the string has no whitespace permitting a line wrap, so the text extends beyond the boundary of its container. We probably just need to tweak overflow behavior for the container.

@jeremystretch commented on GitHub (Apr 19, 2024): In @atownson's example the string has no whitespace permitting a line wrap, so the text extends beyond the boundary of its container. We probably just need to tweak `overflow` behavior for the container.
Author
Owner

@jeffgdotorg commented on GitHub (Apr 19, 2024):

Thanks Jeremy, good catch.

@jeffgdotorg commented on GitHub (Apr 19, 2024): Thanks Jeremy, good catch.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/netbox#9496