Solved

prevent a long word from going into the next div

Posted on 2013-05-21
2
257 Views
Last Modified: 2013-05-21
<?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
0
Comment
Question by:rgb192
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 83

Accepted Solution

by:
Dave Baldwin earned 500 total points
ID: 39186413
Add overflow:hidden; to the styles you want to limit the length.
0
 

Author Closing Comment

by:rgb192
ID: 39186430
thanks for the answer

now I do not like some of the results (hiding the ends of long words)
http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/CSS/Q_28135332.html
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question