JSFiddle - React, Tailwind, and code Playground

by danield770

HTML

<body>
    <div id="wrap">
        <div id="right">Right</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;}

html, body {background-color:gray; height:100%; width:100%}
#wrap
{
    width: 100%;
}
#left, #right {padding:5px;}

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

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