当第一行没有更多空间时,我正试图将多余的文本移动到新行。但我的文字只是继续填充相同的行而不移动到另一行。我怎样才能解决这个问题?我希望在第一行填写文本时移动到下一行。
我已经尝试了
word-wrap: break-word
white-space: initial;
但没有效果。
我的代码如下:
<form onSubmit={ handleSubmit }>
<div className="create_post_div unchange_div">
<Field
name="askQuestionInput"
component="input"
type="text"
className="post_input_preview unchange_div"
placeholder="Ask your question here"
/>
</div>
</form>
我的css课程:
.create_post_div{
width: 100%;
margin-top: 10px;
margin-bottom: 10px;
padding: 10px;
}
.post_input_preview {
width: 640px;
border: none;
margin-bottom: 10px;
font-size: 16px;
outline: none;
}
提前致谢。
答案 0 :(得分:0)
word-wrap: break-word
最近更改为overflow-wrap: break-word
word-break: break-all
因此,如果您有许多固定大小的跨度来动态获取内容,您可能只是更喜欢使用word-wrap: break-word
,因为只有连续的单词在它们之间被打破,并且如果它是包含许多单词的句子,调整空格以获得完整的单词(单词中没有中断)。
如果没关系,请选择其中一个。