[英]Prevent <label></label> from resizing
I have a DIV element which has a <label></label>
and input textbox inside it. 我有一个具有
<label></label>
的DIV元素,并在其中输入了文本框。
Basically, I have enabled jQuery .resizable() on the DIV element but when you make the DIV element smaller than it currently is, the textbox is pushed onto a new line. 基本上,我已经在DIV元素上启用了jQuery .resizable(),但是当您使DIV元素的大小小于当前大小时,文本框将被推到新的一行。
How can I force the <label>
to never go smaller than a set size? 如何强制
<label>
永远不要小于设置的大小?
Thanks! 谢谢!
<div id='div1' style='width:300px'>
<label>Test
<input type='text' style='width:100px' id='inputBox'/>
</label>
</div>
$("#div1").resizable({
handles: "e, w, sw, ne, nw, se"
});
Give it a min-width
: 给它一个
min-width
:
<div id='div1' style='width: 300px; min-width: 300px;'>
Or, preferably: 或者,最好:
#div1 {
min-width: 300px;
width: 300px;
}
jQuery UI's resizable has a minWidth property ( example from the docs ): jQuery UI的可调整大小具有minWidth属性( 来自docs的示例 ):
$( "#resizable" ).resizable({
maxHeight: 250,
maxWidth: 350,
minHeight: 150,
minWidth: 200
});
So you could set the maxWidthProperty to $("label").width()
. 因此,您可以将maxWidthProperty设置为
$("label").width()
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.