[wp-trac] [WordPress Trac] #64827: UI Bug: Long unbroken strings overflow container in Dashboard Activity widget

[WordPress Trac]

#64827: UI Bug: Long unbroken strings overflow container in Dashboard Activity
widget
-------------------------------------+----------------------------------
 Reporter:  ravikhadka               |      Owner:  (none)
     Type:  defect (bug)             |     Status:  new
 Priority:  normal                   |  Milestone:  Awaiting Review
Component:  Administration           |    Version:  trunk
 Severity:  minor                    |   Keywords:  need-tests has-patch
  Focuses:  ui, css, administration  |
-------------------------------------+----------------------------------
 When a post title or content contains a long, unbroken string of
 characters (e.g., a long URL or repeating text without spaces), it breaks
 out of the .activity-block container in the Dashboard Activity widget and
 overlaps adjacent layout elements. This issue affects both normal text
 (like post titles inside <a> tags) and preformatted text inside <pre>
 tags.

 Steps to Reproduce:

 Go to the WordPress admin dashboard.

 Create a new post with a title or content consisting of a single, very
 long string of characters without spaces (e.g., typing hellohelo
 continuously for 100+ characters).

 Publish the post.

 Navigate to the main Dashboard screen and look at the "Activity" widget
 under the "Recently Published" section.

 Observe the text overflowing the widget bounds and overlapping the
 adjacent column.

 Expected Results: The long text string should wrap cleanly within the
 boundaries of the widget container.

 Actual Results: The string overflows horizontally, breaking the UI layout.
 I have attached screenshots demonstrating the issue.

 Proposed Patch:
 I have tested the following CSS fix, which resolves the issue by forcing
 the text to wrap and ensuring the inline link elements respect the
 container's maximum width:


 {{{
 #dashboard_activity ul li,
 #dashboard_activity ul li a {
     overflow-wrap: break-word;
     word-wrap: break-word;
     word-break: break-word;
 }

 #dashboard_activity ul li a {
     display: inline-block;
     max-width: 100%;
     vertical-align: top;
 }

 }}}
 [https://prnt.sc/ZPATJhEQuNQp Before:]
 [[Image( https://prnt.sc/ZPATJhEQuNQp )]]

 [https://prnt.sc/NaqFifi0Q2Gy After:]

 [[Image( https://prnt.sc/NaqFifi0Q2Gy )]]

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/64827>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform