### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

v4.x, v5.x, v6.x, v7.x

### Current Behavior

When using the `ion-infinite-scroll` element in an `ion-content` element that has styling to `display: flex` and `flex-direction: column-reverse`. The ionInfinite emitter will never be triggered.

### Expected Behavior

I expect that the ion-infinite-scroll emitter to be called like normal when position is bottom. Because when column-reverse is used the bottom is the top, so I think the ion-infinite-scroll element should account for that.

### Steps to Reproduce

1. Create an ion-content that has the column-reverse styling
```
.container::part(scroll) {
display: flex;
flex-direction: column-reverse;
}
```

```

```

2. If you scroll up infinite scroll will not be called.

### Code Reproduction URL

_No response_

### Ionic Info

Ionic:

Ionic CLI : 7.1.1
Ionic Framework : @ionic/angular 7.2.3
@angular-devkit/build-angular : 16.2.0
@angular-devkit/schematics : 16.2.0
@angular/cli : 16.2.0
@ionic/angular-toolkit : 9.0.0

Capacitor:

Capacitor CLI : 5.1.1
@capacitor/android : 5.1.1
@capacitor/core : 5.1.1
@capacitor/ios : 5.1.1

Utility:

cordova-res : not installed globally
native-run : 1.7.2

System:

NodeJS : v16.19.0
npm : 8.19.3
OS : macOS Unknown

### Additional Information

The scrollTop of the scrollElement is negative in the infinite scroll element. That is why the distanceFromInfinite is not correctly determined. What we could do, is use the absolute value of the scrollTop value. When this is implemented bottom position will work when flex-direction: column-reverse is used.