CSS3 resize属性仅允许增加DIV大小

leo*_*kot 5 html css resize css3

CSS3中有一个resize属性,可以应用于div(例如http://www.impressivewebs.com/css3-resize/).我正在构建一个丰富的UI,并发现此功能在我的情况下非常有用.我尝试依赖CSS3而不是JavaScript,所以我喜欢这种"原生"解决方案.

这个问题是 - 它不允许用户使盒子小于其原始大小.

它在Safari 5.0.5,Chrome 12.0.742.91中重现,而Firefox 4.0.1在两个方面都调整了一个盒子.

问题:是否有针对所需行为的解决方法?我仍然想坚持使用resize属性.

示例:http://jsfiddle.net/wsCQm/

.resizable {
     height: 100px;
     width: 100px;    
     overflow: scroll;
     resize: both;   
}

<div class="resizable"> 
    Some stuff
</div>
Run Code Online (Sandbox Code Playgroud)

Gre*_*g B 3

这是浏览器设置的

用户代理可以将调整大小范围限制在合适的范围内,例如在元素的原始格式化大小之间,并且大到足以包含所有元素的内容。

http://www.w3.org/TR/css3-ui/#resize