This is the image of the code and the page.ReactJs에서 Flex 항목 사이에 공백을 추가하는 방법은 무엇입니까?
컨테이너의 justifyconent 속성이 작동하지 않는 것 같습니다. 왜 3 어린이 요소가 공간없이 함께 붙어 있습니까?
편집 : justifyContent도 시도했습니다. (그림에서와 같이 JustifyContent 대신에)
ReactJ의 스타일 키는 낙타의 경우가 적어야합니다. 귀하의 경우 JustifyContent를 사용하고 있습니다. 대신, 그것은 JustifyContent이어야합니다.
justifyContent : 'space-between'
이렇게하면 문제가 해결됩니다.
<Paper/> 구성 요소가 사용 가능한 공간을 채우는 것처럼 보입니다. 나는 이것을 보여주기 위해 SUPER 간단한 CodePen을 만들려고했다. (https://codepen.io/venetian13/pen/xPvYaM). flex: 1 및 flex 4은 서로 비례하여 사용 가능한 공간을 채 웁니다. | 1 | 4 | 1 |. 그것들을 분리 시키려면 누적 너비> 컨테이너의 전체 너비를 지정해야합니다.
위대한 참조 : https://css-tricks.com/snippets/css/a-guide-to-flexbox/
는 reactjs에 대한 자바 스크립트 구문의 변화를합니까? –
또한 1 위 아래 4 번째 구성 요소가 필요한 경우 어떻게해야합니까? –
당신이 묻는다면, "자바 스크립트에서 반응이 변하는가?" 당신은 스타일 (CSS)에 reffering하고 있습니다. React에서 인라인 스타일을 사용한다면 lowerCamelCase를 @Amogh P와 똑같이 사용해야합니다. 내가 당신을 위해 CSS를 변환 시키길 원한다면 알려주세요. –
내가 질문에서 언급 한 바와 같이, 하나가 작동하지 않았다 .. –