여백을 사용하여 Div가 다른 Div 사이의 남은 공간을 채우도록 하려면 어떻게 해야 합니까?

여백을 사용하여 남은 공간 채우기

HTML에서 div1과 div3의 너비를 설정했지만 div2는 설정하지 않았습니다. 그러면 div2가 있어야 할 왼쪽 열과 오른쪽 열 사이에 알 수 없는 공간이 남게 됩니다.

div2가 나머지 너비를 채우도록 하려면 여백을 사용할 수 있습니다. 방법은 다음과 같습니다.

#Main {
  width: 500px;
}

#div1 {
  width: 100px;
  float: left;
}

#div2 {
  margin-left: 100px;
  margin-right: 100px;
}

#div3 {
  width: 100px;
  float: right;
}

이 CSS에서는

• div2의 너비가 명시적으로 설정되지 않습니다. 대신 왼쪽과 오른쪽 여백이 각각 100px로 설정됩니다. 이렇게 하면 div2가 div1과 div3 사이의 공간을 차지하게 됩니다.
• HTML에서 div2는 div3 뒤에 배치됩니다. 이렇게 하면 div2가 컨테이너 끝으로 밀리지 않고 div1과 div3의 여백 사이에 배치됩니다.

이러한 CSS 변경을 통해 div2는 #Main 내의 나머지 너비를 자동으로 채웁니다. 세 개의 열 사이에 빈 공간이 없는지 확인합니다.

위 내용은 여백을 사용하여 Div가 다른 Div 사이의 남은 공간을 채우도록 하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!