文本溢出它的容器div的邊緣

我的文本在包含div的內部溢出它應該實際上自動換行的邊。文本溢出它的容器div的邊緣

HTML：

<!DOCTYPE HTML> 

<html> 

<head> 

    <title> 
     Welcome to my site 
    </title> 

    <link rel=stylesheet type="text/css" href=global.css> 

</head> 

<body> 

<div id="main"> 
<p>jjfaljfejjfkadjf;lj;jmvwutpvwjfjdsjfklsdkdfjklsjfkljwjeiojfklslfkjsvfoiwjeorfjviw nfwvfjojwkdsklflskjfvwiernvejveurvnwejfkdsjwjjrfjiowjeionvkjlksjdfkljkljdwijiodjfiovnwjoiejoijfiojkjsljfdkjslfiejskdklfjlksjfeijskdjfklsjkldjfwjnfklsjfwoevjnwfdjshfk 
fsdkjfsjdfkjksjdfkjsljfdkljskl</p> 
</div> 

</body> 

</html>

這是CSS

html { 
    padding:0; 
    margin: 0; 
} 

body { 
    background: #E4E4E4; 
    height:100%; 
    width:100%; 
} 

#main { 
    display: block; 
    background: white; 
    width:960px; 
    margin: 0 auto; 
    position: relative; 
    padding: 5px 5px; 
}

而這裏所顯示的內容：

Screenshot

我已經閱讀過其他問題，但沒有一個能夠解決我的問題。事情是文本不會溢出div的底部。這與我爲div設置的寬度有關嗎？

來源

2012-10-08 Pawan

它的工作原理，因爲它是http://jsfiddle.net/VVEjV/ –

我的一切都很好，測試了代碼，沒有任何問題。我不知道是什麼導致你的問題，但它不是代碼。 –

@ Mr.Alien：不，不。 – Jon

即使你的字符串沒有被破壞（這就是我所假設的你的意思），這會將你的文本包裹在div中。

.wordwrap { 
    white-space: pre-wrap;  /* Webkit */  
    white-space: -moz-pre-wrap; /* Firefox */  
    white-space: -pre-wrap;  /* Opera <7 */  
    white-space: -o-pre-wrap; /* Opera 7 */  
    word-wrap: break-word;  /* IE */ 
}

來源

2012-10-08 07:28:31

我可以看到你的意思，最後的K稍微重疊在Chrome的邊緣。

我建議你填充去除第二5px的，只是有：和

word-wrap:break-word;

這樣，你得到周圍的整個DIV 5px的填充內容將：

padding: 5px;

也加入被包裹。

來源

2012-10-08 07:29:35

問題是你有一個很長的詞。你可以像他們說的那樣做，word-wrap: break-word;，或者你可以隱藏文字。

您可以使用文本溢出，即：

p { 
    text-overflow: ellipsis; 
}

其中：

text-overflow: clip|ellipsis|string;

More info

來源

2012-10-08 07:33:46 Kyubey

文本溢出它的容器div的邊緣

回答

相關問題