React에서 내 앱의 오른쪽 상단에 내 칩이 표시되도록 하려면 어떻게 해야 하나요?

Question

현재 앱의 스테이징 환경을 사용할 때만 나타나는 칩을 로컬 환경에서 만들고 있습니다. 머티리얼 UI에서 이 칩을 가져와 앱의 오른쪽 상단에 표시할 수 없습니다(데스크탑 UI에서 작동). 더 많은 정보가 필요하시면 저희에게 연락해주세요! 내 .jsx 파일은 다음과 같습니다.

import React from 'react'
import Chip from '@material-ui/core/Chip'

const StagingChip = () => (
    <>
      <div>
        <Chip label="Staging" color='info'/>
      </div>
    </>
  )

export default StagingChip

Answer 1

제가 이해한 바에 따르면, 칩의 위치가 고정되도록 설계한 다음 위쪽: 0, 오른쪽: 0을 할당해야 합니다

https://css-tricks.com/almanac/properties/p/location/

으아아아 으아아아

jsx 파일에서 직접 이 작업을 수행할 수도 있습니다.

• 이사하고 싶다면div 元素，请将 style 属性添加到 div style={{position: 'fixed', top: 0, right: 0}}
• 이동만 하고 싶다면 Chip，则将 sx 属性添加到 Chip sx={{position: 'fixed', top: 0, right: 0}}

Answer 2

이것은 position:fixed 솔루션입니다:

으아아아