解决手机网页字段过长导致页面混乱

在做手机端页面时，遇到了一行字体过长导致页面混乱，如显示"ssssssssssssssssssssssssssssssssssssssssssss"，导致手机端网页可以拖拽，然后显示很多空白，页面混乱！

解决方法如下：

<p id="intro">${course.teacher.intro!}</p>

<style type="text/css">
        #intro {  
            width: 100%;  
            height: auto;  
            word-wrap:break-word;  
            word-break:break-all;  
            overflow: hidden;  
        }  
    </style>