动态调整容器大小以适合文本

有许多jQuery插件可以让你调整文本大小以适应容器。 但是，如何动态更改div容器的宽度/高度以适应其中的文本？

下面是一个例子。 正如您所看到的，文本当前正在溢出div。 你怎么能以编程方式调整容器div的大小以适应独立于字体大小和内容的文本？

   
 
This is the text
 
   

Answer 1

它应该用css来完成，但这是如何在JS / jQuery中完成的

 $('#container').each(function(){ var inner = $(this).find('p'); $(this).height(inner.outerHeight(true)); $(this).width(inner.outerWidth(true)); }); 

http://jsfiddle.net/2CDt5/2/

替代解决方案是使用css方法设置宽度高度和显示属性

 $('#container').css({'width':'auto','height':'auto','display':'table'}) 

http://jsfiddle.net/7yH2t/

Answer 2

删除width和height ，添加display:table;

Answer 3

您可以决定盒子如何适合文本 – 宽度或高度。

如果你想要宽度，请改变

 width: auto 

如果你想要身高，那就改变吧

 height: auto 

JSFiddle： http ： //jsfiddle.net/39e7z/