The last time Hackerfall tried to access this page, it returned a not found error. A cached version of the page is below, or clickhereto continue anyway

Max Savin

Breaking text is an art of its own. For example, take a look at how the text in Apple's Safari is rendering:

It looks pretty ugly - I hope you can understand why. What I recommend doing in these situations is manually breaking the text. There are two elements in their message: 1) Safari cannot load the page, and 2) your computer is currently offline. That's where you should break the text in half. Notice how much better it looks:

When doing this, I've noticed an issue with liquid or responsive designs, because sometimes the lines you break end up breaking on their own as well, and then it gets really ugly.

A good solution is to hack the HR element, which I don't think most people use anyway. First, remove all margins, borders, and padding:

hr {    margin: 0px;    padding: 0px;    border: 0px solid transparent; }

Then, use it instead of the BR tag to break lines:

This page can't be displayed because <hr /> your computer is currently offline.

Finally, you can use a media query to set the HR to not display. When you do that, the text will continue as if there is nothing there.

@media only screen and (max-width: 475px) {    hr { display: none; } }

And there you have it folks!

Follow me on

Twitter

and let me know what you think!

Continue reading on maxsavin.com