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