Development/HTML · CSS
[CSS] transform-origin
레오나르도 다빈츠
2022. 5. 24. 08:44
◽ transform-origin
transform-origin: {세로} {가로}
ex) transform-origin: center left; 이라면 세로 기준으로 center, 가로 기준으로 left부터 정렬된다.
const BarGraph = styled.div`
position: absolute;
left: 0;
top: 0;
width: 100%;
transform: scaleX(${({width}) => width / 100});
transform-origin: center left;
transition: transform 1.5s ease;
height: 100%;
background: ${({isSelected}) => isSelected ? 'rgba(126, 198, 81, 0.7)' : 'rgb(198, 198, 198)'};
z-index: 1;
`