css 배경색 없어짐, element 들이 layout 밖으로 나감

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;  
  box-sizing: border-box; 

코드를 작성하니 요소가 사라지는 매직~ 다른 블로그들 찾아보니 아래와 같이 작성하면 된대서 했더니

background-color가 없어지는 매직~

  display: inline-flex; 
  flex-direction: column;
  align-items: flex-end;

 

다시 이것저것 해보기.. 

 

기존 코드 

 

.component .first-component {
  position: relative;
  display: inline-block;
  background-color: rgb(107, 192, 111);
}​

 

수정 코드

 

.first-component {
  position: relative;
  display: inline-block;
  background-color: rgb(107, 192, 111);
}​

 

js코드

 

  <div className="component first-component">
      <div className = "first-component-text">
        <h5>hello</h5>
        <h1>Nice to meet you</h1>
        <button type= "button">바로가기</button>
      </div>
    </div>
  );

 

그래서 결국 뭐가 잘못된 거였을까.. 알려줄 사람?