To add three dots at the of too long text can be done with text-overflow: ellipsis.


<!DOCTYPE html>

		<link type="text/css" rel="stylesheet" href="/index.css">
		<div id="textEllipsis">The quick brown fox jumps over the lazy dog</div>



#textEllipsis {
	text-overflow: ellipsis;
	width: 200px;
	white-space: nowrap;
	overflow: hidden;

The only problem with this approach is if you need wordwrap then it seems that you will have to use javascript...