使内容适合div的宽度

时间:2013-08-01 12:42:14

标签: html css

如何使文本适合div的宽度。这是我的代码

<div class="column">
    <a href="#" class="user_thumbnail">
        <img src="<?=base_url()?>/images/1.jpg" width="100px" height="100px">

    </a>
    <span class="name">texttexttexttexttexttexttexttexttexttext</span>
</div>

当我试图显示文本时,文本溢出div就像一条直线。 如何使用css使文本适合<div class="column">的宽度(宽度= 33%)。

2 个答案:

答案 0 :(得分:15)

<强> word-wrap:break-word

  • 将长词包裹在下一行。
  • 调整不同的单词,使它们不会在中间断开。

所以试试下面的CSS

.column {
    width: 33%;
    word-wrap: break-word;
}

JSFiddle

答案 1 :(得分:3)

您可以使用word-break: break-all;(假设您的意思是符合div的 width ,而不是像标题所说的高度)

.column {
    width: 33%;
    word-break: break-all;
}

http://jsfiddle.net/VbTes/1/