Solved

prevent a long word from going into the next div

Posted on 2013-05-21
2
253 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
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: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

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

Suggested Solutions

Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer …
This article discusses four methods for overlaying images in a container on a web page
In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…

839 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