Jak umieścić dwa divy obok siebie, gdy LEWY jest dopasowany, a inne zajmują pozostałe miejsce?

Próbuję umieścić dwa div obok siebie z następującymi kryteriami:

Oba div muszą pozostać na tej samej linii.Priorytet należy nadać lewemu div. W lewym polu należy wyświetlić jak najwięcej tekstu do punktu, w którym wielokropek jest używany w przypadku przepełnienia.Prawy tekst div powinien być wyrównany do prawej strony. W przypadku przepełnienia należy użyć wielokropka.Tekst jest dynamiczny, więc nie można użyć procentów ani stałych szerokości.Musi tylko pracowaćwebkit oparta na przeglądarceCSS3 rozwiązanie jest preferowane.

Oto kilka przykładowych obrazów tego, jak by to wyglądało:

Wkład

<div class='left'>I should always fit. If not, ellipsis should be used.</div><div class='right'>Right align and fit me if space available here.</div>

Wydajność

Wkład

<div class='left'>I should always fit. If not, ellipsis should be used. And some more text and more, and more text.</div><div class='right'>Right align and fit me if space available here.</div>

Wydajność

Wkład

<div class='left'>This text is left aligned.</div><div class='right'>This text is right aligned.</div>

Wydajność

questionAnswers(2)

yourAnswerToTheQuestion