div不適合內容

我有一個問題，當它包含長詞的div不適合內容。它只需要最大寬度。div不適合內容

截圖：

http://img687.imageshack.us/img687/3253/photondf.png

我想DIV採取相同寬度的內容沒有JavaScript。

HTML

<div class="div"> 
    <p>fkjdajfkdjfkdjfkdfjkdfjkdfjdfdjkfkjfdkdfioiewtiovvuiocuvicxvocxvuiocxvucioxbuvbhxjk 
    civuiozxviopucvicvuvjcizoxvopcxvpiovxzijpvxzicovpzvjijopcvzxpvjiocvpjzvicvzpjvci.</p> 
<div>

CSS

.div { 
    float: left; 
    background:red; 
    max-width: 900px; 
}

來源

2012-11-06 Web Designer

你能發佈整個HTML文件嗎？有可能另一個父DIV或風格也阻止了這一點。 – Lipongo

究竟想獲得股利辦？你是否希望它縮小到內容的大小，但不超過900像素？

來源

2012-11-06 23:03:54 Ben

是的！我希望div縮小到內容的大小。 –

但是是否必須有900px的最大寬度？或者會有圍繞它的父母的div？ – Ben

是的，它必須是最大寬度900px。 –

嘗試width: auto;但保留max-width如果您不希望您的div大於900px。

來源

2012-11-06 23:05:03 Hachi

好吧，這裏有幾個問題。

p中的內容根本沒有空間。換句話說，它將無法「分割」多行上的單詞。而你的div實際上有正確的寬度。
除非你真的不想把它分成多行。您可以將div上的overflow定義爲auto或hidden。在這種情況下，auto將添加滾動條，而hidden將簡單地隱藏經過的內容。
如果overflow在任一p或div，實際上，你可以強制文字環繞在CSS3：http://www.w3schools.com/cssref/css3_pr_word-wrap.asp
既然你的DIV定義的寬度，它確實一直使用的寬度和從未更多。（不要將溢出的文本計數大於div）。計算佈局大小和其他div的位置時，不應該考慮溢出的文本。

順便說一句，一個很長的字符串，這樣是不是一個真正的好「用例」，如果你有問題的時候其實有空格。你應該把它粘貼在這裏而不是那個。

編輯

您的DIV不能「適合」與長字的內容，它會擴散到最大寬度可能，然後在達到最大寬度時，將換到其他線路。如果單詞大於div，它會溢出。

編輯2

如果你真的想這樣做，有一個辦法。但這很難看。在每個長詞之後，你必須添加一個<br />。如果你在模板引擎中傳遞文本，你甚至可以用替換你的空間。但說實話，就是不要這樣做。

來源

2012-11-06 23:05:19

它是第一行末尾的空格，所以有兩個字符串。一個字符串在第一行，另一個在第二行，但問題是div不佔用較長字符串的寬度，但它採用最大寬度。 –

問題是因爲你沒有任何斷線，它會吃掉所有的空間，一旦它達到最大寬度，它會嘗試換行到可能的其他行。否則會溢出。即使在第一個單詞之後有一個空格，但沒有足夠的空間來放置第二個單詞。但是佈局計算不會在每次換行時檢查div大小。它只會重新計算每個新行的寬度。（以「
」爲例） –

http://jsfiddle.net/ZuQWA/ –

div不適合內容

回答

相關問題