Fix how long URLs appear in Chrome/Chromium #5

Open
opened 2 years ago by simoon · 0 comments
simoon commented 2 years ago
Owner

Reporting this issue while developing a newsletter publication with the following CSS properties on the root element:

overflow-wrap: break-word;
word-wrap: break-word;

This is to allow words to break across columns, and renders as expected in both Chrome and Firefox. However, in Chrome, some text sequences in URLs (e.g. long hashes of numbers after trailing slashes) do not break.

This is an issue reported on elsewhere: https://stackoverflow.com/questions/21299403/chrome-long-url-in-table-issue

The solution suggested is to add the class "break" judiciously to HTML elements that need to break, and add the collowing CSS:

td.break {
    word-break: break-all;
}

This forces the line of the URL to break, but it breaks across columns and then the URLs become unclickable.

Reporting this issue while developing a newsletter publication with the following CSS properties on the root element: ``` overflow-wrap: break-word; word-wrap: break-word; ``` This is to allow words to break across columns, and renders as expected in both Chrome and Firefox. However, in Chrome, some text sequences in URLs (e.g. long hashes of numbers after trailing slashes) do not break. This is an issue reported on elsewhere: https://stackoverflow.com/questions/21299403/chrome-long-url-in-table-issue The solution suggested is to add the class "break" judiciously to HTML elements that need to break, and add the collowing CSS: ``` td.break { word-break: break-all; } ``` This forces the line of the URL to break, but it breaks across columns and then the URLs become unclickable.
Sign in to join this conversation.
No Label
No Milestone
No project
No Assignees
1 Participants
Notifications
Due Date

No due date set.

Dependencies

This issue currently doesn't have any dependencies.

Loading…
There is no content yet.