не в состоянии сделать максимальную ширину

Question

У меня есть страница с таким содержанием ...

<div id="content">
testingtestingtestingtestingtestingtestingtestingtestingtesting
testingtestingtestingtestingtestingtestingtestingtesting
testingtestingtestingtestingtesting
</div>

Как мне применить максимальную ширину. Я использую этот код в CSS

#content {
    max-width:50px; /* for standards-compliant browsers */
   /*width:expression(document.body.clientwidth > 650? "650px": "auto" );*/ 
   /* max-width expression for IE only */
}

но я не получаю результаты в Firefox ... http://pradyut.dyndns.org/WebApplicationSecurity/width.jsp

Есть ли какие-либо решения JavaScript?
Любая помощь
спасибо
Pradyut

Answer 1

Ну, причина, по которой вы не получаете ожидаемый результат на странице, которую вы указали по ссылке, заключается в том, что вы используете span вместо div.

Добавить

display: block;

в твоем стиле.

Answer 2

Итак, в вашем CSS вы можете установить для свойства word-wrap значение break-word, чтобы ваша строка текста (без пробелов) соответствовала максимальной ширине:

1007 * Е.Г. *

<style type="text/css">

#content {
    max-width: 50px;
    word-wrap: break-word;
}

</style>

Answer 3

#content {
    max-width: 50px;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

Вы можете удалить display: inline-block; в зависимости от контекста вашего элемента.

Answer 4

Если бы вы использовали свой собственный пример, вы обнаружите, что работает просто отлично . На странице, на которую вы ссылаетесь, используется элемент span, который по умолчанию является встроенным элементом. Встроенные элементы не могут иметь ширину или высоту. Если вы хотите установить максимальную ширину для элемента span, установите для его отображения значение block или inline-block:

<span id="content" style="max-width:50px; display:block;" >  
testingtestingtestingtestingtestingtestingtestingtestingtesting  
testingtestingtestingtestingtestingtestingtestingtesting  
testingtestingtestingtestingtesting  
</span>