Quantcast
Channel: Active questions tagged flexbox - Stack Overflow
Viewing all articles
Browse latest Browse all 1675

How to keep all columns in a single ion-row in Ionic >= 2

$
0
0

I have a page in my Ionic 2 application where I what a gird of items, where each item takes a single row.

A simplified example can be seen at this plkr

Looking at the first row, I have 3 columns (red, gray, and orange).

enter image description here

I want the first two columns to stay fixed width, and have the last column take up the rest of the row. If the text is too long, I just want it to truncate and show ellipsis (which I do using the style='white-space: nowrap; overflow: hidden;text-overflow: ellipsis

Now, if I shrink the width of the page, the last column moved to be under the other rows....

enter image description here

Is there a way to have this third column stay in the same row, and just show the ellipsis once it runs out of room there (ie like below...)? I have tried everything!

enter image description here


Viewing all articles
Browse latest Browse all 1675

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>