1. ホーム
  2. css

[解決済み] div要素内でテキストが折り返されない

2022-02-26 23:23:44

質問

テキストがdivの中で折り返されないという、今までにない問題が発生しています。

このリンクに私のhtmlコードのサンプルがあります。

http://jsfiddle.net/NDND2/2/

<div id="calendar_container">
   <div id="events_container">  
      <div class="event_block">
         <div class="title">
            lorem ipsum lorem ipsumlorem ipsumlorem ipsumlorem
         </div>
      </div>
   </div>
</div>

何かお手伝いできることはありますか?

解決方法は?

それは、その長い文字列にはスペースがないため、コンテナから抜け出さなければならないからです。追加 word-break:break-all; を .title ルールに追加して、強制的に改行させます。

#calendar_container > #events_container > .event_block > .title {
    width:400px;
    font-size:12px;
    word-break:break-all;
}

jsFiddleの例