How to Advocate for Universal Access to GitHub Student Pack for All Students

Select Language:

If you’re having trouble with text not displaying properly or pages not loading correctly because of long unbroken strings or URLs, don’t worry. Here’s a simple solution to fix that issue:

First, locate the section where the text or URL seems to be overflowing or breaking the layout. You’ll want to add some code to make sure long strings automatically break and wrap to the next line instead of stretching the page.

You can add this CSS style to your webpage:

css
word-wrap: break-word;
word-break: break-all;
overflow-wrap: break-word;

This code tells browsers to automatically break long words or links onto the next line, keeping the layout neat and readable.

For example, if you’re editing a style sheet, add:

css
body {
word-wrap: break-word;
word-break: break-all;
overflow-wrap: break-word;
}

Or, if you only want this behavior for specific sections, apply it to those containers, like so:

css
#specific-container {
word-wrap: break-word;
word-break: break-all;
overflow-wrap: break-word;
}

Once you include this in your site’s CSS, long URLs or unbroken strings will no longer stretch out your page. Instead, they’ll wrap to the next line gracefully, making your content easier to read and your page look cleaner.

Remember, adjusting your CSS is a simple way to improve how your webpage handles long text strings. Just add this style, and your layout will stay intact, regardless of how long the text or links are.