tour window shakes when not full screen

[Emily-Feng]

3fb84094-eb1d-4912-9123-ca8ef97b4e38.mp4

the screen shakes a lot before goes back to normal

our code

 const steps: any = [
    {
      target: ".connectButton",
      placement: "auto",
      disableBeacon: true,
      showSkipButton: true,
      content: (
        <>
        <div
          style={{
            display: "flex",
            flexDirection: "column",
            alignItems: "center",
          }}
        >
        <h3>Share your interview screen</h3>
        <span
          style={{
            fontSize: "14px",
            color: colorTextSecondary,
            width: "90%",
          }}
        >
        <p>
        By sharing your interview screen, we allow Sensei to process the questions
        in real-time! For a quick test, and open the mock interview and share screen.
        </p>
        </span>
        <img src={ScreenShareInstructionalImage} height={400} style={{display:'block'}}/>
        <span style={{ padding: "8px" }} />
        <Button
          type="primary"
          style={{
            height: "40px",
            background:
              "linear-gradient(135deg, rgba(91, 91, 255, 0.8) 0%, rgba(75, 75, 255, 0.9) 100%)",
            }}
          onClick={handleOpenMockInterview}
        >
          Open Mock Interview ✨
        </Button>
        </div>
        </>
      ),
    },
  ]
  
<Joyride
      callback={handleOnboardingStateChange}
      steps={steps}
      run={tourEnabled}
      styles={{
        options: {
          zIndex:1000,
          width:500,
        },
        buttonNext: {
          display: "none",
        },
      }}
    />
    <div
      style={{
        padding: "12px 24px 24px",
        display: "flex",
        flexDirection: "column",
        alignItems: "center",
        justifyContent: "center",
      }}
    >

[gilbarbara]

Hey @Emily-Feng
Using placement auto can trigger unexpected behaviors.
Could you try setting up another placement to see if it helps?