In making responsive my app, i'm transforming all my grids in lists, or better, in collapsable lists. In some situation i put in the main row main info and in the collapsed rows, secondary info. But now i have to insert in the main row more than one single column and have only one row.... If i use
Code A Description A Quantity A Code B1 Description B1 Quantity B1 Code C23 Description C23 Quantity C23
What i need is more similar to a table (but responsive) Code A Description A Quantity A Code B1 Description B1 Quantity B1 Code C23 Description C23 Quantity C23
And these columns can became rows on smaller devices And i can still expand these rows with secondary info
Code A Description A Quantity A
Price A
Supplier A
Code B1 Description B1 Quantity B1
Price B1
Supplier B1
Code C23 Description C23 Quantity C23
Price C23
Supplier C23
Is it possible ?
Thanks
re: Another question on lists in HTML/CSS and bootstrap FoxInCloud Support - Thierry N.
Michele
Apr 4, 2020 @ 01:55am
Ciao Michele,
To have columns that stack up on smaller device, use the Bootstrap grid system:
<div class="row">
<div class="col-sm-4">Code A Description A Quantity A Price A Supplier A</div>
<div class="col-sm-4">Code B1 Description B1 Quantity B1 Price B1 Supplier B1</div>
<div class="col-sm-4">Code C23 Description C23 Quantity C23 Price C23 Supplier C23</div>
</div>
you can probably nest accordions
A clearer description, with real data, would help.