SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    Get my greedy down dotJoon's Avatar
    Join Date
    Apr 2003
    Location
    daejeon, South Korea
    Posts
    2,223
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    3 columns and long text created by a user

    Code:
    <!doctype html> 
    <html> 
      
      <head> 
        <meta charset="UTF-8"> 
        <title>collapse1</title> 
      </head> 
    
    <style type="text/css">
    
    .wrapper {
     margin:0px auto;
     text-align:left;
     border:0px; 
     overflow:hidden;
    clear:left;
    }
    
    
    .center {
     float:left;
     width:100%;
     margin:0 -250px 0 -250px;
    }
    
    .content {
    border-collapse:collapse;
    margin:0 250px 0 250px;
    border:2px solid green;
    padding:5px;
    background-color:#ddffdd;
    }
    
    .left {
     width:250px;
     float:left;
    }
    
    .right {
     width:250px;
     position:relative;
     float:right;
     z-index:1;
    }
    </style>
    
    <body> 
    
    <div class="wrapper">
      <div class="left">left column</div> 
     
      <div class="center"> 
      <div class="content"> 
     
        content created by a user<br>
        content created by a user<br>
        content created by a user<br>
        content created by a user<br>
        content created by a user<br>
        content created by a user<br>
        content created by a user<br>
        content created by a user<br><br>
        longTextByUserlongTextByUserlongTextByUserlongTextByUserlongTextByUser
      </div>
      </div> 
      
      <div class="right">right column</div>  
    </div>
    
    </body> 
    </html>
    I have the code above at http://dot.kr/x-test/collapse1.php

    How can I make a line break in the long text without any space?
    (I like to know whether it's possible or not.)

  2. #2
    SitePoint Zealot
    Join Date
    Feb 2009
    Location
    Baton Rouge, LA
    Posts
    122
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    word-wrap: break-word;

    (it's part of CSS3, but works in IE7/8, FF3.5+, Chrome)
    "The browser is your first client" - Quote: Myself
    Please visit me at: vanillacloud.com

  3. #3
    Mouse catcher silver trophy Stevie D's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    5,888
    Mentioned
    122 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by dotJoon View Post
    How can I make a line break in the long text without any space?
    (I like to know whether it's possible or not.)
    You can insert a "soft-hyphen", with the character entity &#038;shy;, which allows the browser to hyphenate the word there if it needs to, but if it can fit the whole word in then it will. You might want to put more than one of these in at appropriate points where you want to allow a break.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •