text overflow

http://stackoverflow.com/questions/18566883/css-ellipsis-in-left-aligned-text-of-single-line-of-dynamic-width-text-where-wi

by FiNGAHOLiC

HTML

<body>
    <div id="wrap">
        <div id="right">Right with more text</div>
        <div id="left">Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left Left</div>
        
    </div>
</body>

CSS

* {border:0; margin:0; padding:0;}

#wrap {
    width: 100%;
}

#left, #right {padding:5px;}

#left {
    background-color:red;
    text-align:left;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

#right {
    background-color:orange;
    float:right;
    text-align:right;
	white-space: nowrap;
}