해결된 질문
작성
·
359
0
export const Row = styled.div`
display: flex;
flex-direction: row;
width: 100%;
justify-content: space-between;
padding: 0 24px;
margin: 8px 0;
`;
<Row style={{ justifyContent: "start" }}>
<InputFieldSmall style={{ marginRight: "16px" }}>
<Input placeholder="07250" />
</InputFieldSmall>
<ButtonBlack>우편번호 검색</ButtonBlack>
</Row>
안녕하세요!
컴포넌트 재사용성에 관하여 질문드리고 싶은게 있습니다!
1일차 게시글 작성 UI 만들기 과제를 진행하던 중 CSS 스타일을 재사용 하기 위해서 Row라는 컴포넌트를 만들었습니다.
UI상 justify-content속성에 space-between 또는 flex-start 같이 약간만 변하는 부분이 존재해서 inline-stlye을 사용하였습니다.
제공 해주신 레퍼런스 코드에는 inline-style을 사용하지 않으셨는데 inline-style을 사용하는 것은 좋지 않은 방식인가요?
답변 1
1
안녕하세요 aphopis님!
inline-style을 사용하지 않는 이유 중 가장 큰 부분은 코드 가독성 때문입니다.
따라서 aphopis님 처럼 짧게 작성하는 것은 큰 문제가 되지않습니다.
다만, CSS를 inline-style로 작성하게 되면 CSS의 적용 우선순위가 올라가게 됩니다.
때문에 해당 부분을 잘 고려해서 작성해주셔야 합니다.
감사합니다.😁