Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <div class="box">
    This is a long and Honorificabilitudinitatibus califragilisticexpialidocious Taumatawhakatangihangakoauauotamateaturipukakapikimaungahoronukupokaiwhenuakitanatahu
   グレートブリテンおよび北アイルランド連合王国という言葉は本当に長い言葉
  </div>
  
  
  <div class="info-card">
    <div class="row1">
      <b>1.</b><span>This is a long and Honorificabilitudinitatibus califragilisticexpialidocious Taumatawhakatangihangakoauauotamateaturipukakapikimaungahoronukupokaiwhenuakitanatahu</span>
    </div>
    <div class="row2">
      <b>2.</b><span>This is a long and Honorificabilitudinitatibus califragilisticexpialidocious Taumatawhakatangihangakoauauotamateaturipukakapikimaungahoronukupokaiwhenuakitanatahu</span>
    </div>
    <b>3.</b><span>This is a long and Honorificabilitudinitatibus califragilisticexpialidocious Taumatawhakatangihangakoauauotamateaturipukakapikimaungahoronukupokaiwhenuakitanatahu</span>
  </div>
  
  
  
</body>
</html>
 
.box {
  background: #ddd;
  width: 200px;
  margin-bottom: 80px;
  
  
  white-space: pre-line;
  
}
.box span {
  display: inline-block;
}
.info-card {
  background: #ddd;
  width: 300px;
  
  b {
    color: red;
  }
  
  .row1 {
    display: flex;
    b {
      margin-right: 20px;
    }
    span{
      overflow-wrap: anywhere;
    }
  }
  
  .row2 {
    b {
      display: inline-block;
      width: 30px;
      vertical-align: top;
    }
    span {
      display: inline-block;
      width: 270px;
      overflow-wrap: break-word;
    }
  }
  
  .row3 {
    float: left;
    b {
      width: 30px;
      display: inline-block;
      vertical-align: top;
    }
    span {
        width: 270px;      
        display: inline-block;        
        overflow-wrap: break-word;
      /* overflow-wrap: anywhere; */
        
    }
    
  }
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
m6fishpro
0viewers