반응성을 깨지 않고 인라인 블록 요소를 중앙에 배치하는 방법은 무엇입니까?

인라인 블록 요소를 중앙에 배치하는 방법

인라인 블록 요소를 중앙에 배치하는 것은 전통적인 방법의 한계로 인해 까다로울 수 있습니다. 그러나 CSS를 사용하는 간단한 해결책이 있습니다.

문제

margin-left 및 margin-right auto를 사용하여 인라인 블록 요소를 가운데에 맞추려고 하면 그렇지 않습니다. 인라인 블록 요소에는 정의된 너비가 없기 때문에 작동합니다. 표시 속성을 차단으로 설정하면 중앙 정렬 문제가 해결되지만 응답성이 손상되고 전체 요소가 강조 표시되지 않습니다.

해결책

인라인 블록 요소를 중앙에 배치하려면, text-align: 컨테이너 중앙을 설정합니다. 이렇게 하면 인라인 블록 요소가 컨테이너 내에서 수평으로 중앙에 배치됩니다.

예

.container {
  text-align: center;
}

.equationElement {
  display: inline-block;
}

데모

[데모 링크]

위 내용은 반응성을 깨지 않고 인라인 블록 요소를 중앙에 배치하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!