세 번째 Div를 왼쪽 정렬로 유지하면서 Div 요소를 오른쪽 정렬하는 방법은 무엇입니까?

여백과 부동 소수점을 사용하여 Div 요소 정렬

문제 설명:

사용자가 두 개의 div 요소를 오른쪽 정렬하려고 합니다. (버튼 및 양식) 세 번째 div(캔버스)를 왼쪽 정렬로 유지합니다. 그러나 처음 두 요소를 정렬하려고 하면 요소가 차례로 표시되는 대신 나란히 표시됩니다.

여백 및 부동 소수점을 사용한 솔루션:

제공된 코드는 플로팅을 활용하여 버튼과 양식을 정렬합니다. 일반적으로 플로팅은 작동하지만 IE 6, 7에서는 문제가 있는 것으로 알려져 있습니다.

이 문제를 해결하려면 버튼과 양식이 포함된 내부 div에 플로팅 대신 여백을 사용하는 것이 좋습니다. 수정된 CSS는 다음과 같습니다.

#addEventForm {
  position: relative;
  margin-left: auto;
  margin-right: 0;
  border: 2px solid #003B62;
  font-family: verdana;
  background-color: #B5CFE0;
  padding-left: 10px;
}

설명:

• margin-left: auto: 이는 내부 div를 포함된 div의 오른쪽 가장자리.
• margin-right: 0: 이렇게 하면 div가 오른쪽 공간을 차지하지 않아 버튼이 남은 공간을 차지할 수 있습니다.

여백을 사용하면 IE를 포함한 다양한 브라우저에서 보다 일관된 동작을 제공하여 요소가 의도한 대로 정렬되도록 할 수 있습니다.

위 내용은 세 번째 Div를 왼쪽 정렬로 유지하면서 Div 요소를 오른쪽 정렬하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!