2011-06-25 127 views
0

我有一個div容器,其中包含用戶以前輸入的文本。我想調整這個文本的div的大小。我不能擁有固定的尺寸,因爲我不知道文本的長度。如果沒有指定大小div取整個窗口的寬度。這對我造成了一些問題,因爲我使用JQuery可拖動插件,並且在div被拖動時立即出現滾動條。對此有何建議?如何動態設置div大小?

回答

2

用css或style屬性來做到這一點。 <div style="display:inline-block"> stuff </div>

display:inline; < ---用於歌劇。

display:inline-block; < ---對於其他瀏覽器。

你可以做瀏覽器的檢查與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

+0

不會傷害有所準備>我做的:P – robert

+0

真棒,正是我一直在尋找,謝謝! – Vonder

+0

有沒有聽說過'window.opera'?不是說,userAgent嗅探是任何微笑,但Opera使它非常容易。 – 2011-06-25 03:28:25

1
<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; 
} 
+0

另外,它需要修復IE6和IE7 http://flipc.blogspot.com/2009/02/damn-ie7-and-inline-block.html – bcoughlan