Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 312
  • Last Modified:

prevent a long word from going into the next div without cutting off urls with overflow:hidden

<?php
$row_color='blue';
echo'
<style>
    div.col1{width:10%;border-width:1px;border-color:blue;border-style:solid;float:left;}
    div.col2{width:50%;border-width:1px;border-color:blue;border-style:solid;float:left;}
    div.col3{width:40%;border-width:1px;border-color:blue;border-style:solid;float:left;}
</style>
 <div class="col1">stuff</div>
  <div class="col2">stuff</div>
  <div class="col3">stuff</div>
  <div style="clear:both"></div>
   <div class="col1">stuff</div>
  <div class="col2">stuff<br>morestuff<br>looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong word</div>
  <div class="col3">stuff</div>
  <div style="clear:both"></div>
   <div class="col1">stuff</div>
  <div class="col2">stuff</div>
  <div class="col3">stuff</div>

Open in new window


is there a way to cut off long words (maybe hyphenate long word) because this is cutting into the next column

overflow:hidden; I do not want because I can not see the long urls and I want to copy paste
div.col3{width:40%;border-width:1px;border-color:blue;border-style:solid;float:left;overflow:hidden;}
0
rgb192
Asked:
rgb192
1 Solution
 
Jagadishwor DulalBraces MediaCommented:
Add css attribute:
 word-wrap: break-word;

Open in new window


CSS is:

div.col2{border-color: blue;
    border-style: solid;
    border-width: 1px;
    float: left;
    width: 50%;
    word-wrap: break-word;}

Open in new window

0
 
rgb192Author Commented:
thanks
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now