字母汉字可以换行 标点符号不能换行_html/css_WEB-ITnose

<div class="chatbox">				<div class="chatpicleft">					@@##@@				</div>				<div class="chatcontentleft">					<div class="chatboxleft">						<span class="textclass">hello.你好呀!标点不会自动换行标点不会自动换行标点不会自动换行。。。。。。。。。。。。。。。。。。。。。。。。</span>					</div>				</div>			</div>						<div class="chatbox">				<div class="chatpicright">					@@##@@				</div>				<div class="chatcontentright">					<div class="chatboxright">						<span  class="textclass">hello</span>					</div>				</div>			</div>						<div class="chatbox">				<div class="chattime"><span>12:30</span></div>			</div>						<div class="chatbox">				<div class="chatpicleft">					@@##@@				</div>				<div class="chatcontentleft">					<div class="chatboxleft">						<span class="textclass">标点不会自动换行标点不会自动换行标点不会自动换行标点不会自动换行标点不会自动换行标点不会自动换行hellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohello</span>					</div>				</div>			</div>		</div>

.chatbox{	padding:1rem 1rem 0rem 1rem;	position:relative;}.chatpicleft{	height:2.5rem;	width:2.5rem;	float:left;	position:absolute;}.chatcontentleft{	margin-left:3.5rem;	margin-right:4.5rem;}.chatpicright{	height:2.5rem;	width:2.5rem;	right:1rem;	float:right;}.chatcontentright{	text-align:right;	margin-left:4.5rem;	margin-right:3.5rem;}.chattime{	text-align:center;}.input{	position:fixed;	bottom:0;	z-index:9999;	height:3rem;	width:100%;	background-color:gray;}.textclass{	word-break:break-all;}.chatboxleft{	display:inline-block;	padding:0.5rem;	background-color:#ffffff;	-webkit-border-radius:0.3rem;	-moz-border-radius:0.3rem;	-o-border-radius:0.3rem;	border-radius:0.3rem;}.chatboxright{	display:inline-block;	padding:0.5rem;	background-color:#ffffff;	-webkit-border-radius:0.3rem;	-moz-border-radius:0.3rem;	-o-border-radius:0.3rem;	border-radius:0.3rem;}

.textClass{	word-break: break-all;	word-wrap: break-word;}