Advanced Search

Prevent Long URL's From Breaking Out with CSS

/ Published in: CSS
Save to your folder(s)
This solution will help you to prevent many issues with your site, when you need to prevent long URL's from breaking out of container.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <style type="text/css">
  2. .break {
  3.     -ms-word-break: break-all;
  4.     word-break: break-all;
  5.     word-break: break-word; 
  6.     -webkit-hyphens: auto;
  7.     -moz-hyphens: auto;
  8.     hyphens: auto;
  9. }
  10.  
  11. .ellipsis {
  12.     width: 250px;
  13.     white-space: nowrap;
  14.     overflow: hidden;
  15.     -ms-text-overflow: ellipsis; /* Required for IE8 */
  16.     -o-text-overflow: ellipsis; /* Required for Opera */
  17.     text-overflow: ellipsis;
  18. }
  19. </style>

URL: http://www.apphp.com/index.php?snippet=css-breaking-out-long-urls

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.