I have the following template of a card: pen. It is comprised of two sections "one" and "two".
<div id="one">
<div id="two">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's...
</div>
<div id="three">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been...
</div>
</div>
Both of the sections have content that overflows their respective size. I would like to maximize #two div, so that it will take maximum (and ellipsis the rest) size and leave one line for the #three div.
If there is not enough content for #two then take its respective size and give all size left to #three.
Edit:
I would like to fix the width and allow the height to grow to a certain limit and then ellipsis