Question

I have a div container with a text that has been previously typed in by the user. I would like to adjust the size of the div to this text. I cannot have fixed size because I dont know the length of the text. If there is no size specified div takes the width of entire window. This cause some problems for me because I am using JQuery draggable plugin and the scrollbars appear immediately when the div is dragged. Any advice on that?

Answer 1

do this with css or with the style property. <div style="display:inline-block"> stuff </div>

display:inline; <— for opera.

display:inline-block; <— for other browsers.

You can do the browser check with javascript

something like this

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

then set the style display option based on that variable

Keep in mind this will cause a flow like behavior so if you need a new line make sure to add <br /> after the div

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

OR you can use <span></span> instead of div