Question

我有文字可重新调整大小的DIV。我只在宽度上操作，高度应该是自动大小但不小于文本（内容）。怎么做？

我的代码：

HTML：

<div id="block">
  sadfasda asfasfasf asfafafaf a a a fasfas fasfafasfaf
  asffasdf as fasfasfa sfasfafasfaf akflj jalj faldjfajf'a
  klasdjf lka;sjfajf ljasfljaflkj f jf  f jfaj flajklfjalfj
  klasjf  f lkajfajf lajf lajf al alfjasl jall fafasff
</div>

CSS：

#block {border: 1px solid red; width: 300px; height: auto; padding: 5px}

JS：

$("#block").resizable({
    maxWidth: 500,
    minWidth: 115
});

这里是DEMO

Answer 1

解决方案可能是使用像这样的收容容器。这将使你的容器保持控制：）

编辑： ohno ..当它变小时它不起作用..让我看看

EDIT2： 现在确实如此！

jsFiddle

<强> HTML

<div id="block">
  <div class="content">
    sadfasda asfasfasf asfafafaf a a a fasfas fasfafasfaf
    asffasdf as fasfasfa sfasfafasfaf akflj jalj faldjfajf'a
    klasdjf lka;sjfajf ljasfljaflkj f jf  f jfaj flajklfjalfj
    klasjf  f lkajfajf lajf lajf al alfjasl jall fafasff
  </div>
</div>

<强> JS

var block = $("#block");

block.resizable({
    maxWidth: 500,
    minWidth: 115,
    resize : function(e) {
      block.height(block.find('.content').height())
    }        
});

<强> CSS

#block {
    border: 1px solid red; 
    width: 300px; 
    height: auto; 
    padding: 5px
}

jquery ui resizable可以防止身高比文字小

1 个答案: