Skip to content

Web: Step markers don't align with thumb positions #743

@bananer

Description

@bananer

Environment

  • are you using the new architecture? yes

  • which version of react & react-native are you using?

    "react": "19.1.0",
    "react-native": "0.81.4",

Description

On Web, stepNumber and StepMarker don't align with the thumb position towards the left and right edge. For the center value it matches, but the further you go left and right the further off it is.

Image Image Image

When comparing Web and Android, the underlying problem might also be that on web, the whole slider has less margin left and right.

On web, the slider hast the same width as the Button below:

Image

Same code on Android, the slider has less width and the step markers align:

Image

Reproducible Demo

https://snack.expo.dev/@bananer_rw/react-native-slider-step-marker-repro

Metadata

Metadata

Assignees

No one assigned

    Labels

    bug reportSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions