Max-width 80% results in horizontal scrollbar if content too big for window.
I want the text to come to next line if it does not fit 80% of a small window. but i get scrollbar instead.
<!DOCTYPE html>
<html>
<head>
<style>
body{
height: 98.5%;
margin: 0;
}
</style>
</head>
<body>
<table id="tblChat" style="width: 100%; height: 100%; margin: 0;" cellspacing="0" cellpadding="0">
<tr style="height: 85%; background-color: #fafaf7; border: solid 1px lightgray; border-bottom: none;">
<td style="vertical-align: top; height: 100%;">
<div id="divCommLog">
<div style="max-width:80%;border:1px solid red;">hfghfghfghfghfghfghfghfhfghfghfghfghfghfghfghfghgfghfhfghfghfghfghfghfghfghfghgfghfhfghfghfghfghfghfghfghfghgfghfhfghfghfghfghfghfghfghfghgfghfghgfghfgh</div>
</div>
</td>
</tr>
</table>
</body>
</html>