在css中限制文本区域

Question

我试图限制我可以在我的网站上写文本的区域。

<div id="header"> 
<div id="text"> 
    sample text 
</div> 
</div> 

当我尝试在text写人物众多，有没有断线超过给定的空当。

#header 
{ 
background-color: #fff; 
height: 100px; 

} 

#text 
{ 
margin-left: 200px; 
width: 200px; 
} 

我的错误是什么？

Answer 1

做到这一点的方法： -

#text 
{ 
    margin-left: 200px; 
    width: 200px; 
    border: 1px solid; 
    word-wrap: break-word; 
}​ 

参考LIVE DEMO

Answer 2

如果您尝试执行换行操作，以下操作将起作用。

#text{ 
    word-wrap: break-word;  /* Most modern browsers */  
    white-space: pre-wrap;  /* CSS3 */ 
    white-space: -moz-pre-wrap; /* Firefox */  
    white-space: -pre-wrap;  /* older versions of Opera */ 

} 

该word-wrap财产并不仅限于较新的浏览器。老的浏览器似乎也支持它。

从CSS3草案，

遗留原因，某些实验CSS属性不遵循这个 前缀约定。两个常见的例子是“文字包装”和 “文本溢出”属性，在引入供应商 在CSS2.1中的前缀策略之前，由Microsoft Internet Explorer引入前缀 ，随后实施 前缀未定浏览器，尽管缺乏W3C规范，但仍然依赖前缀名称。

查看文章here和w3c reference。