divに収まるようにコンテンツを縮小

Question

私は記述が入るdivを持っています。しかしdivはある幅と高さを超えてはいけません。

divに入るコンテンツによって、divが制限を超えます。

divを制限を超えないようにコンテンツを強制的にサイズ変更するにはどうすればよいですか？

私のdivはこのように見えます。

#Description { 
    margin-top: 0px; 
    max-height: 150px; 
    max-width: 230px; 
    background-color: #365478; 
    display: inline-block; 
    max-width: 500px; 
    display:table;     
} 

これは、説明divを呼び出すために使用しているHTMLです。

<?php echo "<div id = 'Description'>" . $output[Description] . "</div>" ?> 

私がここで取り組んでいるウェブサイトの問題を見るのに役立つ場合は、 luke.dx.am

Answer 1

<table> elements（及びdisplay: table有するもの）が自動的かかわらず指定された最大幅の、その内容の全てが含まれることができるように拡張します。段落をテーブルに直接に出力したいというのも奇妙です。そのため、コンテンツをdisplay: blockのように変更することをおすすめします。

これに加えて、テキストに省略記号を付けると、制限された領域に収まらないテキストが多い場合には3つのドットが表示されます。行われているように、これは、white-space: nowrap、overflow: hiddenとtext-overflow: ellipsisを適用することによって行うことができる次

#Description { 
    display: block; 
    width: 250px; 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
} 

また、それは私のフィルターによってブロックされてのために、私は、あなたのサイト上で手動でテストすることができませんことに留意すべきです性的コンテンツのために。私はあなたがそこにホスティングしているのか疑問に思うだけです）