如何动态设置div大小？

Question

我有一个div容器，其中包含以前由用户输入的文本。我想调整div的大小到这个文本。我不能有固定的大小，因为我不知道文本的长度。如果没有指定大小，div占用整个窗口的宽度。这会给我带来一些问题，因为我使用的是JQuery draggable插件，拖动div时会立即显示滚动条。有什么建议吗？

Answer 1

使用css或style属性执行此操作。 <div style="display:inline-block"> stuff </div>

display:inline;＆lt; ---用于歌剧。

display:inline-block;＆lt; ---用于其他浏览器。

您可以使用javascript进行浏览器检查

类似这样的事情

 var divBlock=(navigator.userAgent.indexOf('Opera')>-1)?"inline":"inline-block";

然后根据该变量设置样式显示选项

请注意，这会导致类似行为的流量，因此如果您需要新行，请确保在div之后添加<br />

<div style="display:inline-block;">stuff</div>
<br />
<div style="display:inline-block">stuff 2</div>

或者您可以使用<span></span>代替div

Answer 2

<div class="myText">My Text</div>

.myText {
    display: inline;
}

这会将div的长度更改为宽度。如果您希望能够指定最小高度和宽度，请使用inline-block：

.myText {
    display: inline-block;
    min-width: 40px;
    max-width: 120px; //If you want to start wrapping text at a certain width;
}