Как сделать длинный текст подходящим внутри небольшого div?

Question

У меня есть div с указанной шириной, но текст внутри него не разбивается и не устанавливается в div соответственно.

Это может быть неправильный вопрос. Как сделать его пригодным внутри div?

Я считаю, что его невозможно установить полностью внутри, по крайней мере, он может быть установлен внутри div в соответствии с шириной не высотой.

Css

.limit{ 
    width:50px; 
} 

HTML

<div class="limit"> 
    <p>fasfhfhsjdhkjhdkjhfjkhdsfjkhdfjhdfiuhadfhjdfhjadskf kjahsdjfahdfuahsdf dhsf</p> 
</div> 

JSFIDDLE

Answer 1

Все, что вам нужно, это word-wrap: break-word;

.limit{ 
 
    width:50px; 
 
    word-wrap: break-word; 
 
}

<div class="limit"> 
 
    <p>fasfhfhsjdhkjhdkjhfjkhdsfjkhdfjhdfiuhadfhjdfhjadskf kjahsdjfahdfuahsdf dhsf</p> 
 
</div>

Demo

С другой стороны, если вы не хотите разорвать предложение, вы можете также использовать overflow набор свойств для auto или overflow-x: scroll; - Demo

Answer 2

Modified предел класса. Вы можете показать весь текст в одной строке.

CSS

.limit p { 
    overflow-x: scroll; 
    white-space: nowrap; 
    width: 50px; 
}