Ion-grid with reorder wrapped in div

Hi!

There are two questions:

1. when dragging the reorder element to the upper or lower border, the rest of the grid does not scroll. To drag to the right place, you have to make several attempts.

2. the first column consists of cells sticky horizontally on the left - and everything is ok. But if you scroll to the left to some threshold, then the sticky column still goes to the left behind the screen. I think it has to do with the number of columns in the column (12). I tried to change --ion-grid-columns, but it breaks the cell sizes I need.

<div class ="scrolling-wrapper">
	<ion-grid>
		<ion-row style="position:sticky; top: 0; z-index: 9900;">
			<ion-col size = 2 style="background-color: #555d54;">00</ion-col>
			...
			<ion-col size = 2 style="background-color: #555d54;">00</ion-col>
		</ion-row>
	
		<ion-reorder-group [disabled]="isDisabled" (ionItemReorder)="handleReorder($any($event))">
			<ion-reorder *ngFor = "let i of items; let j = index">
				<ion-row>
					<ion-col size = 2 style="position:sticky; left: 0; z-index: 5000;"><ion-icon name="home" size="large"></ion-icon></ion-col>
					<ion-col size = 2 *ngFor = "let item of i">{{item}}</ion-col>
				</ion-row>
			</ion-reorder>	
		</ion-reorder-group>	
	</ion-grid>
</div>

1 post - 1 participant

Read full topic